Question

我正在使用Google Maps V3 API创建多边形。它从一个四边形多边形开始，这是一个正方形。

问题：现在，当向多边形添加新点时，多边形可能会以奇怪的形状重叠，而不是形成五边形。这是因为按照将点添加到数组的顺序绘制多边形。是否可以重新排列多边形点，使2条线彼此不重叠？

Answer 1

我已成功实施了上面的Blazemonger建议，它对我有用。

这是他的小说建议：

另一种方法，对我来说似乎更简单：如果新点是（a）不在现有多边形的内部，（b）创建一个内角大于180度，则必须无效。有许多现有算法用于测试点是否在多边形的内部（stackoverflow.com/q/471962/901048）和测量内角是一个找到差异的问题每个斜坡的arctangents之间

为了确定该点是否在多边形中，我使用了Mike Williams更新的epoly.js中的polygon.Contains函数，在此处找到：http://www.geocodezip.com/scripts/v3_epoly.js。

如果该点不在多边形（见上文），我们： 1.）确定最后两个矢量的内角是否大于180度。为此，我们需要实现下面的等式来找到多边形的最后两个向量的角度：

angleRadians = Math.acos（（vx1 * vx2 + vy1 * vy2）/（Math.sqrt（vx1 * vx1 + vy1 * vy1）* Math.sqrt（vx2 * vx2 + vy2 * vy2）））;

这是使用矢量的Dot产品。

但是这并没有考虑到'缠绕方向'，首先你必须得到交叉产品，如果交叉产品是正数，那么它是左转，如果是负的 - 右转。

我在这里包含了我的JS代码，作为要点：https://gist.github.com/3741816。

顺便说一下，我是StackOverflow的新手 - 这对我来说是一个非常好的资源，感谢所有贡献者！

Answer 2

我们可以检测到两个多边形的重叠。但是我只用js编写代码，然后通过错误提示来防止多边形的重叠。

包括库的CDN。
现有多边形位于js变量或js数组中的多边形形状中。（即）
制作新的多边形。
将第二个多边形搜索到第一个多边形。两个多边形相同，因此您可以更改它们。您必须使用这些库的CDN。

https://maps.googleapis.com/maps/api/js?v=3 https://code.jquery.com/jquery-1.11.1.min.js https://bl.ocks.org/christophermanning/raw/4450188/javascript.util.min.js https://bl.ocks.org/christophermanning/raw/4450188/jsts.min.js https://cdnjs.cloudflare.com/ajax/libs/wicket/1.1.0/wicket.js https://cdnjs.cloudflare.com/ajax/libs/wicket/1.1.0/wicket-gmap3.js

          var values=[ new google.maps.LatLng(59.73858,10.24296), new 
           google.maps.LatLng(59.74879,10.26459), new 
           google.maps.LatLng(59.73858,10.28965), new 
           google.maps.LatLng(59.7192,10.28965), new 
           google.maps.LatLng(59.7192,10.24296), new 
           google.maps.LatLng(59.73858,10.24296)];
          var new_shape=[ new google.maps.LatLng(59.73858,10.24296), new 
           google.maps.LatLng(59.74879,10.26459), new 
           google.maps.LatLng(59.73858,10.28965), new 
            google.maps.LatLng(59.7192,10.28965), new 
            google.maps.LatLng(59.7192,10.24296), new 
            google.maps.LatLng(59.73858,10.24296)];


           var existing_polygon = new google.maps.Polygon({
                         paths: values,
                         strokeColor: #000000,
                         strokeOpacity: 0.8,
                         strokeWeight: 1.5,
                         fillColor: #ff0000,
                         fillOpacity: 0.35,
                           });

              var polygone_new_shape= new google.maps.Polygon({
                     paths: [new_shape],
                     strokeColor: '#000000',
                     strokeOpacity: 0.8,
                     strokeWeight: 1,
                     fillColor: '#00FF00',
                     fillOpacity: 0.35
                     });


         var wkt = UseWicketToGoFromGooglePolysToWKT(existing_polygon, polygone_new_shape);
         var result= UseJstsToTestForIntersection(wkt,wkt);
                if(result==true){
                   alert("Polygon are overlapping existing polygon");
                   }

       function UseWicketToGoFromGooglePolysToWKT(poly1, poly2) {

                 var wicket = new Wkt.Wkt();
                  wicket.fromObject(poly1);
                  var wkt1 = wicket.write();
                  wicket.fromObject(poly2);
                  var wkt2 = wicket.write();
                    return [wkt1, wkt2];
                  }
         function UseJstsToTestForIntersection(wkt1, wkt2) {

                  var wktReader = new jsts.io.WKTReader();
                  var geom1 = wktReader.read(wkt1);
                  var geom2 = wktReader.read(wkt2);
                  var result;
                 if (geom2.intersects(geom1)) {
                   result=true;
                  }else{
                  result=false;
                  }
                 return result;
                }

Answer 3

我决定将此问题留在我的网络应用中，直到有人解决它为止!!

防止多边形重叠到自身上

3 个答案: