按老师照抄，为何不显示，各位大神帮看一看
慕粉4042427
2016-12-07 21:50
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<canvas id="canvas" style ="divplay:black;margin:0 auto;border:1px solid #aaa;"><!--显示画布框架-->
当前浏览器不支持Canvas，请更换浏览器后再试
</canvas>
<script>
window.onload = function(){
var canvas=document.getElementById('canvas');
canvas.width=800;
canvas.height=800;
var ctx=canvas.getContext("2d");
drawRoundRect(context,100,100,600,500,50);
}
function drawRoundRect(cxt,x,y,width,height,r,) {
cxt.save();
cxt.translate(x, y);
pathRoundRect(cxt,width,height,r);
cxt.strokeStyle ="black";
cxt.stroke();
cxt.restore();
}
function pathRoundRect(cxt,width,height,r) {
cxt.beginPath();
cxt.arc(width-r,heigh r, r, 0,Math.PI/2 );
cxt.lineTo(r, height);
cxt.arc(r, height-r, r, Math.PI/2, Math.PI);
cxt.lineTo(0,r);
cxt.arc(r, r, r, r.Math.PI, Math.PI*3/2);
cxt.lineTo(width-r, 0);
cxt.arc(width-r, r, r, Math.PI*3/2, Math.PI*2);
cxt.closePath();
}
</script>
</body>
</html>
2回答
-
- 等待下一个约定
- 2016-12-08 17:39:02
你那上面的代码var ctx=canvas.getContext("2d");明明是ctx,drawRoundRect(context,100,100,600,500,50); 你传的参数是context肯定不行呀
-
- 大学霸
- 2018-01-08 15:31:48
很多书写上的错误，建议仔细检查下
Canvas绘图详解
72881 学习 · 422 问题
相似问题