老师，右边的眉毛怎么调整方向啊！
来源：3-8 编程练习
不醉不会z
2018-09-25 22:08:58
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>canvas</title>
<style>
canvas{background-color:lightblue;}
</style>
</head>
<body>
<canvas id="canvas" width="800" height="800">
您的浏览器不支持canvas
</canvas>
<script>
//在此处写出代码
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>canvas</title>
<style>
canvas{background-color:lightblue;}
</style>
</head>
<body>
<canvas id="canvas" width="800" height="800">
您的浏览器不支持canvas
</canvas>
<script>
//在此处写出代码
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
ctx.moveTo(300,50);
ctx.lineTo(350,200);
ctx.strokeStyle="#000";
ctx.stroke();
ctx.beginPath();
ctx.moveTo(500,50);
ctx.lineTo(450,200);
ctx.strokeStyle="#000";
ctx.stroke();
ctx.strokeRect(300,200,200,130);
ctx.strokeRect(280,230,20,50);
ctx.strokeRect(500,230,20,50);
ctx.beginPath();
ctx.arc(320,220,20,2*Math.PI,true);
ctx.strokeStyle='#000';
ctx.stroke();
ctx.beginPath();
ctx.arc(340,250,10,0,2*Math.PI,true);
ctx.strokeStyle='#000';
ctx.stroke();
ctx.beginPath();
ctx.arc(450,220,10,2*Math.PI,true);
ctx.strokeStyle='#000';
ctx.stroke();
ctx.beginPath();
ctx.arc(460,250,10,0,2*Math.PI,true);
ctx.strokeStyle='#000';
ctx.stroke();
ctx.strokeRect(355,280,90,30);
ctx.strokeRect(330,330,140,200);
ctx.strokeRect(100,390,230,20);
ctx.strokeRect(470,390,230,20);
ctx.strokeRect(350,530,30,200);
ctx.strokeRect(420,530,30,200);
</script>
</body>
</html>
1回答
-
好帮手慕星星
2018-09-26
右边的眉毛可以这样调整：
圆的半径要和左边的一致，改变起始角和结束角就可以了。
整体的效果图是不错的呢，自己完善测试下，继续加油~~
0
相似问题
回答 1
回答 1