                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /JS实现人机大战之五子棋（UI篇）

输出不了棋盘

为什么我和老师写的一模一样画出来不对啊,,

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 , 435);

context.stroke();

context,moveTo(15 , 15 + i*30);

context.lineTo(435 , 15 + i*30);

context.stroke();

}

// context.moveTo(0,0);

// context.lineTo(450,450);

// context.stroke();

}

对角线没问题 ,这一段显示出来就变成右下半部的折线了

dollzcx

2017-01-18

源自：JS实现人机大战之五子棋（UI篇） 2-2

关注问题我要回答

1203

操作

收起

5 回答

调皮的魔法少女李狗蛋儿
2017-08-26

兄弟，你的代码里面

context,moveTo(15 + i*30 , 15);//context后面是逗号

context.lineTo(15 + i*30 , 435);

context.stroke();

context,moveTo(15 , 15 + i*30);//context后面是逗号

context.lineTo(435 , 15 + i*30);

context.stroke();

你自己数数context后面用了几个句号...你这种图怕是阴差阳错画出了高级canvas函数图喔。

0 回复有任何疑惑可以回复我~

dollzcx 提问者
2017-01-19

我怎么觉得你写的和我是一样的啊..摸的意思是说逗号两边的空格?我本来就加了啊..

0 回复有任何疑惑可以回复我~

亂世伊仁
2017-01-18

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 , 435);
context.stroke();
context.moveTo(15 , 15 + i*30);
context.lineTo(435 , 15 + i*30);
context.stroke();

你中间的context.moveTo（15 + i * 30，15）; 用了逗号了

现在这样应该没问题了

0 回复有任何疑惑可以回复我~

dollzcx 提问者
2017-01-18

图片附上

0 回复有任何疑惑可以回复我~

dollzcx 提问者
2017-01-18

对了我浏览器用ff和chrome都试过不行

0 回复有任何疑惑可以回复我~

举报

0/150

提交

取消

JS实现人机大战之五子棋（UI篇）

参与学习 35579 人
解答问题 136 个

利用js及canvas绘图知识，实现程序界面编写和交互逻辑处理

本课相似问答

4 回答棋盘格子出不来？

2 回答棋盘显示不出来

2 回答棋盘格子画不出来

4 回答为什么我的棋盘显示不出来？

6 回答跟着老师敲完代码了，点击棋盘，没出现棋子，出现报错

搜索更多本课相关问答

输出不了棋盘

我要回答关注问题

意见反馈帮助中心 APP下载