【发布时间】:2016-08-31 08:55:47
【问题描述】:
我有一个简单的六边形网格,我在其中选择一组六边形,然后将填充一些随机点。
让我解释一下生成点的确切过程:
- 我使用十六进制坐标列表来选择六边形。
- 将六边形组合成区域。
- 为每个区域单独存储所有边缘点。
- 循环通过区域:
- 计算区域边界(用于定义随机点生成器的范围)
- 绘制区域(边界)正方形。 (查看计算是否正确)
- 根据边界平方的最小值、最大值生成随机点
- 测试点是否在区域形状内。 (形状由区域边缘点定义)
- 如果该点通过了上述测试,则将其推入数组中。
- 循环遍历点数组并将它们绘制在屏幕上。
现在我尝试了这两种方法来确定一个点是否位于特定形状内。
cn_PnPoly: function( P, V, n ){ ///// Point , array of vertices , array size ////
var cn = 0, vt = 0.0;
for (var i=0; i< (n-1); i++) { // edge from V[i] to V[i+1]
if (((V[i].y <= P.y) && (V[i+1].y > P.y)) // an upward crossing
|| ((V[i].y > P.y) && (V[i+1].y <= P.y))) { // a downward crossing
// compute the actual edge-ray intersect x-coordinate
vt = (P.y - V[i].y) / (V[i+1].y - V[i].y);
if (P.x < V[i].x + vt * (V[i+1].x - V[i].x)) // P.x < intersect
++cn; // a valid crossing of y=P.y right of P.x
}
}
return (cn&1); // 0 if even (out), and 1 if odd (in)
},
结果:
isInHexBounary: function( p, points, l ){ ///// Point , array of vertices , array size ////
var result = false;
for (i = 0, j = l - 1; i < l; j = i++) {
if ((points[i].y > p.y) != (points[j].y > p.y) && (p.x < (points[j].x - points[i].x) * (p.y - points[i].y) / (points[j].y-points[i].y) + points[i].x)) {
result = !result;
}
}
return result;
},
结果:
我想第一种方法要求所有点都按特定顺序排列,这就是它无法正常工作的原因。 但第二个似乎工作几乎是正确的,除了某些部分。知道我做错了什么吗?
更新:
事实证明,对于大多数算法,它需要以特定顺序排列点,因此我计算了每个点相对于平均中心点的角度。然后按角度对所有点进行排序。两种算法现在都返回相似的结果。虽然有一些点通过区域形状泄漏。
findCenter: function( points ){
var x = 0, y = 0, i, len = points.length;
for (i = 0; i < len; i++) {
x += points[i].x;
y += points[i].y;
}
return {x: x / len, y: y / len};
},
findAngles: function(c, points){
var i, len = points.length, p, dx, dy;
for (i = 0; i < len; i++) {
p = points[i];
dx = p.x - c.x;
dy = p.y - c.y;
p.angle = Math.atan2(dy, dx);
}
},
sortByAngle: function( points ){
points.sort(function(a, b) {
if (a.angle > b.angle) return 1;
else if (a.angle < b.angle) return -1;
return 0;
});
},
结果:
【问题讨论】:
标签: javascript random shape point hexagonal-tiles