棋盘格子出不来？
来源：2-2 画棋盘
454167659
2016-07-25 18:29
画线出不来？？
写回答
关注
4回答
-
- 454167659
- 2016-07-25 18:48:58
for(var i = 0; i < 15; i++) { context.moveTo(15 + i * 30, 15); context.lineTo(15 + i * 30, 435); context.stroke(); context.moveTo(15, 15 + i * 30); context.lineTo(435, 15 + i * 30); context.stroke(); -
- 454167659
- 2016-07-25 18:46:23
宽度设置错了，起点和终点一样了。。。。
-
- 454167659
- 2016-07-25 18:42:08
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>五子棋大战</title> <link rel="shortcut icon" href="//static.segmentfault.com/global/img/favicon.eee09a32.ico" type="image/x-icon" /> <link rel="stylesheet" type="text/css" href="css/style.css" /> </head> <body> <canvas id="chess" width="450px" height="450px"></canvas> <script type="text/javascript" src="js/script.js" ></script> </body> </html> #chess{ display: block; margin:0 auto; box-shadow: -2px -2px 2px #EFEFEF,5px 5px 5px #B9B9B9; } window.onload = function() { var chess = document.getElementById('chess'); var context = chess.getContext('2d'); context.strokeStyle = "#BFBFBF"; for(var i = 0; i < 15; i++) { context.moveTo(15 + i * 30, 15); context.lineTo(15 + i * 30, 15); context.stroke(); context.moveTo(15, 15 + i * 30); context.lineTo(15, 15 + i * 30); context.stroke(); } } -
- 截灬慕彡
- 2016-07-25 18:35:54
麻烦给个代码，是不是被背景图片覆盖了啊，这是棋盘格子代码
var drawChessBoard = function(){ for(var i=0;i<15;i++){ context.moveTo(15+i*30,15); context.lineTo(15+i*30,435); context.stroke(); context.moveTo(15,15+i*30); context.lineTo(435,15+i*30); context.stroke(); } }
JS实现人机大战之五子棋（UI篇）
利用js及canvas绘图知识，实现程序界面编写和交互逻辑处理
35650 学习 · 136 问题
相似问题