为了账号安全,请及时绑定邮箱和手机立即绑定

为什么我用canvas画不出那条线

为什么我的context.lineTo(700,700),画不出来那条线。

正在回答

6 回答

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title></title>

</head>

<body>

<canvas id="canvas" width="1024" height="768" style="border:1px solid #aaa;display: block;margin: 20px auto;"><!-- 默认宽300像素,高150像素 -->

    当前浏览器不支持canvas,请切换浏览器后再试;

</canvas> 

<script type="text/javascript">

  window.onload=function(){

        var canvas=document.getElementById('canvas');

        var context=canvas.getContext("2d"); 

         canvas.width=1024;

         canvas.height=768;

        context.moveTo(100,100);

        context.lineTo(700,700);

        context.lineWidth=5px;

        context.strokeStyle="#005588";

        context.stroke();

  }

  </script>

</body>

</html>

到底错哪了,没显示啊,就一个框

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

疚人

把context.lineWidth=5px;中的px去掉
2017-07-14 回复 有任何疑惑可以回复我~

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>canvas01</title>

</head>

<body>

<canvas id="canvas" style="border:1px solid #aaa;display:block;margin:50px auto;">

当前浏览器不支持canvas,请更换更高级的浏览器,如谷歌、火狐等。

</canvas>

<script>

widow.onload = function(){

var canvas = document.getElementById("canvas");

canvas.width = 1024;

canvas.height = 650;

var context = canvas.getContext("2d");//使用context绘制

context.moveTo(100,100);

context.lineTo(300,300);

context.strokeStyle="#005588";

context.stroke();

}

</script>

</body>

</html>

同样没有画出线 哪里的问题啊 晕死了

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

青春无敌美少女

同问出不来啊啊啊
2017-02-17 回复 有任何疑惑可以回复我~
#2

青春无敌美少女

大哥你的window 打错了
2017-02-17 回复 有任何疑惑可以回复我~
#3

吾爱分享逸轩 回复 青春无敌美少女

..后来解决了 出不来肯定是代码和老师的不一样 不然不肯能出不来
2017-02-22 回复 有任何疑惑可以回复我~
#4

青春无敌美少女 回复 吾爱分享逸轩

恩恩,我有个地方错了。 你那个课程学完了吗。。
2017-02-23 回复 有任何疑惑可以回复我~
查看1条回复

是不是少了context.stroke()?

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

context.moveTo(200,100);要先用moveTo给一个开始的点

context.lineTo(700,700);


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

就是canvas

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

context.moveTo()

context.lineTo()

哥们你要画什么线

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

举报

0/150
提交
取消

为什么我用canvas画不出那条线

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信