从给定角度和长度的x,y绘制一条直线

Question

在Javascript中,我想从x/y绘制一条具有给定长度和角度的线.我不想从x1/y1到x2/y2画一条线.我有一个x/y原点,一个角度和一个长度.

该行需要位于特定位置的标准网页顶部.

我怎样才能做到这一点？

谢谢

Answer 1

moveTo(x,y)定义线的起点定义线
lineTo(x,y)的终点

所以你想要这样的东西:

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
x1 = 30;
y1 = 40;
r =  50;
theta = 0.5;
ctx.moveTo(x1, y1);
ctx.lineTo(x1 + r * Math.cos(theta), y1 + r * Math.sin(theta));
ctx.stroke();

你必须确保它theta是弧度的,并且ctx被定义为你想要的任何画布上下文(在上面的代码中,这意味着你想要像

<canvas id="myCanvas" width="200" height="100"
style="border:1px solid #000000;">
</canvas>

在你的HTML).

如果theta是度数,你可以使用Math.cos(Math.PI * theta / 180.0)而Math.sin(Math.PI * theta / 180.0)不是Math.cos(theta)和Math.sin(theta)完成工作......