老师，为什么我的刻度没有循环》？

首页课程实战体系课手记专栏慕课教程

老师，为什么我的刻度没有循环》？

来源：4-10 编程练习

sunflower426

2020-05-18 22:22:01

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>案例</title>

<style>

canvas{background-color:lightblue;}

</style>

</head>

<body>

<canvas id="canvas" width="600px" height="600px">您的浏览器不支持</canvas>

<script>

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

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

//在此处编写代码

context.arc(200,120,100,0,Math.PI*2,true);

context.fillStyle="pink";

context.fill();

context.beginPath();

for(var i=0;i<4;i++){

context.rotate(Math.PI/2);

context.moveTo(290,120);

context.lineTo(300,120);

};

context.stroke();

context.beginPath();

context.strokeStyle="blue";

context.moveTo(200,120);

context.lineTo(280,120);

context.moveTo(200,120);

context.lineTo(210,60);

context.stroke();

</script>

</body>

</html>

写回答

1回答

好帮手慕码

好帮手慕码

2020-05-19

同学你好，解答如下：

（1）需要添加translate方法：

（2）圆点从0，0开始画：

所以循环的时候划线的位置也需要改变：

效果如下：

关于指针的位置可以再优化一下。

如果我的回答帮到了你，欢迎采纳，祝学习愉快~

0

0 学习 · 4826 问题

相似问题

为什么刻度不显示

回答 1

老师我还是有一个疑问啊

回答 1

老师在步骤二中忘了一件事

回答 1

老师，刻度显示不出来

回答 1

老师，有什么可以改进的

回答 1

打开慕课网App查看更多内容