使用javascript在1点上绘制自定义数量的直线

Question

我正在尝试使用html5和canvas / KineticJS开发一个小应用程序。我想跟踪一些从2d点到无限点的光线，只需设置一个自定义角度。例如，如果我设置90°应用程序应该渲染四条光线（两条直线，一条垂直线和一条水平线，在我的2d点相遇）。如果我设置60°，我应该看到3条直线，如星号*

Answer 1

你需要绘制的最长线是画布对角线的大小：

var r = Math.sqrt(Math.pow(canvas.width, 2) + Math.pow(canvas.height, 2));

使用sin和cos计算该半径的每个终点：

var theta = delta * Math.PI / 180.0;
var dx = r * Math.cos(n * theta);
var dy = r * Math.sin(n * theta);

然后，只需从（x，y）到（x + dx，y + dy）绘制线条。 Simples