                        课程
                    
                        /前端开发
                        
                            /Html5
                        
                        /炫丽的倒计时效果Canvas绘图与动画基础

这些代码不能画出线条

<!doctype html>

<html>

<head>

<meta charset="UTF-8">

<title>Untitled Document</title>

</head>

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

<body>

<script>

window.onload=function(){

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

canvas.wdith=1024

canvas.height=768

var cantext=canvas.getContext("2d")

context.moveTo(100,100)

context.lineTo(700,700)

context.stroke()

}

</script>

</body>

</html>

lxlx2520

2016-04-04

源自：炫丽的倒计时效果Canvas绘图与动画基础 2-2

关注问题我要回答

596

操作

收起

2 回答

kertz
2016-04-26

1---canvas元素没放到body里，你放在body外面。

2---context.move后面的都错了，你声明的是var cantext=canvas.getContext("2d"),所以要用cantext.moveTo,cantext.lineTo,cantext.stroke

ps：既然你的canvas已经有width,height属性了为什么js里还要声明一次。（js里面你的width写错了）

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

慕粉9003383
2016-04-04

var cantext=canvas.getContext("2d") 注意这里的变量名和下面的不一样哦

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

举报

0/150

提交

取消

炫丽的倒计时效果Canvas绘图与动画基础

参与学习 96589 人
解答问题 999 个

学习HTML5中最激动人心的技术Canvas，彻底释放自己的创造力

本课相似问答

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

2 回答为什么画不出直线呢

1 回答如何画一条自适应的直线呢？

1 回答不显示线条

2 回答能帮我看看代码不没有弹球的动画

搜索更多本课相关问答

这些代码不能画出线条

我要回答关注问题

意见反馈帮助中心 APP下载