javascript多边形交集

Question

我使用了以下代码： http://www.amphibian.com/blogstuff/collision.html。在html测试文件中，我将第一个三角形更改为

triangle1.addPoint({"x":-20, "y":-20});
triangle1.addPoint({"x":-20, "y":20});
triangle1.addPoint({"x":20, "y":20});
triangle1.addPoint({"x":20, "y":10});
triangle1.addPoint({"x":10, "y":10});
triangle1.addPoint({"x":10, "y":-20});

现在，当我在穿过它之前移动另一个三角形内部时，给我错误的交叉点。知道哪里可能是问题？

Answer 1

好的，我为其他想要玩这个游戏的人设置了fiddle。结果如下：

该脚本使用分离轴定理或（如维基百科所称）Hyperplane separation theorem，如polygon.js的来源所述：

/*
 *  To detect intersection with another Polygon object, this
 *  function uses the Separating Axis Theorem. It returns false
 *  if there is no intersection, or an object if there is. The object
 *  contains 2 fields, overlap and axis. Moving the polygon by overlap
 *  on axis will get the polygons out of intersection.
 */
Polygon.prototype.intersectsWith = function(other) {

此定理仅适用于凸多边形。您的形状不是凸面的，因为它具有“凹痕”。这就是脚本错误地报告形状相交的原因。如果你需要使它与凹形一起工作，你必须首先将凹形分割成单独的凸形部分然后将该定理应用于所有单独的部分。显然，这会使脚本更复杂，因为您需要迭代两个形状的凹陷部分的叉积。

Answer 2

这是我找到两个多边形的交叉多边形的不太复杂的实现。

它适用于凸多边形和凹多边形，但不适用于复杂（自相交）多边形。 算法与Margalit & Knott中提出的算法非常相似。

其复杂度约为4 * n1 * n2，其中n1和n2是计算交点的多边形顶点数。

这是一个单独的.js文件。 A＆＃39; Polygon＆＃39;被认为是2D点的任何javascript数组。 A＆＃39; Point＆＃39;是任何具有x和y数字属性的javascript对象。

在现有功能之上实现联盟功能应该不是问题，我很快就会这样做。

Intersection of 2D polygons