使用JavaScript

时间:2017-06-06 02:14:44

标签: javascript math svg path

我正在尝试根据用户输入的角度绘制圆的周长。角度确定周长完成:360°是整圆,180是圆的一半,依此类推。

我的问题是:考虑到圆的半径,角度和中心坐标,我该如何动态计算周长的路径?

我知道这可能是基本的数学,但到目前为止我尝试过的一切都没有用。

这是我的小提琴:https://jsfiddle.net/Hal_9100/L311qq88/ 我的问题是找到路径的x和y坐标的正确公式:

var x = i * (radius * Math.cos(angle)) + centerX;
var y = i * (radius * Math.sin(angle)) + centerY;

我在这里错了吗?

以下是我正在尝试做的一个示例:请注意,只应绘制黑色边界:我只是使用红色虚线来给出一个视觉示例,说明应如何根据值绘制周长由用户提供。

enter image description here

1 个答案:

答案 0 :(得分:2)

是的,问题在于你的数学问题。这是计算x,y坐标对的正确方法(注意迭代是从零到所需的角度,而不是从零到半径):

for (var i = 0; i <= angle; i++) {
        var x = (radius * Math.cos((i-90)*Math.PI/180)) + centerX;
        var y = (radius * Math.sin((i-90)*Math.PI/180)) + centerY;

如果用这三行代替,你的小提琴就可以了。