Question

这个需要一点可视化，如果我的解释很糟糕，那就很抱歉。

所以，我有一个0,0的中心点。从这一点来说，我正在绘制圆周上的随机点，半径为350像素（随机数）。为此，我使用此代码：

var angle = Math.random()*Math.PI*2;
var x = Math.cos(angle)*radius;
var y = Math.sin(angle)*radius;

x+=parent.position.x;
y+=parent.position.y;

parent.position这是因为绘制的每个点也充当中心节点，其子节点充当节点，依此类推。这只是设置新节点相对于其父节点位置的位置。

因此，此代码非常适合中央节点。问题是，一旦你离开中心，你想继续沿着一个特定的方向移动，以避免一大群节点互相干扰。因此，虽然此代码在圆周上绘制一个点，但我需要能够在圆周的一段上绘制一个点。我想也许可以接近三分之一的圆周。另一个障碍是，这必须是圆周的正确部分，即如果节点向上分支，我不希望该部分是圆周的下半部分，分支需要继续向上移动。

我可以根据新父节点相对于其父节点位置的位置建立一般方向。但有没有人有任何想法如何使用这些数据来减少这个方向的细分市场？

让我知道如果没有意义，没有图表就很难解释。

Answer 1

我认为这样做的一个简单方法是将您的圆圈分成n个区段（每个区域覆盖2 * PI / n角度）。你可以将n设置为你想要的任何东西，具体取决于你想要的精确程度。然后，当你计算一个新的点x时，首先得到x.parent所在的段（相对于它自己的父段），然后使用它将x放在同一段wrt x.parent中。然后你可以这样：

var getSection = function(point) {
  var parent = point.parent;
  var angle = Math.acos((point.x - parent.x) / radius) % (Math.PI*2);
  var section = Math.floo(angle / (Math.PI * 2 / n))
  return section;
}

var section = getSection(parent); // return the index of the section
var angle = (Math.random() + section) * Math.PI * 2 / n
var x = Math.cos(angle)*radius;
var y = Math.sin(angle)*radius;

x+=parent.position.x;
y+=parent.position.y;

在圆周段上绘制点

1 个答案: