如何使用jsts或turf.js将重叠的多边形转换为不重叠的多边形？

编程问答 2022-06-10

问题描述

我正在尝试使用Google地图，turf.js和JSTS将重叠的多边形转换为非重叠的多边形。但是我从草皮和JSTS中都得到了一个错误。

我尝试了以下操作：

  1. 使用JSTS：

     CheckIntersections() {
 for (let i = 0; i < this.OverlappedPolygons.length; i++) { // Here I am having array of Overlapped Polygons
   let polygon1 = this.OverlappedPolygons[i];
   let wkt1 = this.ConvertToWkt(polygon1);
   for (let k = 0; k < this.OverlappedPolygons.length; k++) {
     if (this.OverlappedPolygons[i].id.trim().toUpperCase() !== this.OverlappedPolygons[k].id.trim().toUpperCase()) {
       let polygon2 = this.OverlappedPolygons[k];
       let wkt2 = this.ConvertToWkt(polygon2);
       let wktReader = new jsts.io.WKTReader();
       let geom1 = wktReader.read(wkt1);
       let geom2 = wktReader.read(wkt2);

       if (geom2.intersects(geom1)) {
         let intersect = geom1.intersection(geom2);
         let intersectpoly = this.ShowWktPoly(intersect,'red',0.8);
         intersectpoly.setMap(this.map);
         let new1 = geom1.difference(intersect);
         let new2 = geom2.difference(intersect);
         let newpoly1 = this.ShowWktPoly(new1,'black',0.2);
         newpoly1.setMap(this.map);
         let newpoly2 = this.ShowWktPoly(new2,0.2);
         newpoly2.setMap(this.map);
       }
     }
   }
 }
}
ConvertToWkt(poly1) {
 let wicket = new Wkt.Wkt();

 wicket.fromObject(poly1);
 let wkt1 = wicket.write();
 return wkt1;
}
ShowWktPoly(object,color,opacity) {
 // Instantiate JSTS WKTWriter and get new geometry's WKT
 let wktWriter = new jsts.io.WKTWriter();
 let wkt = wktWriter.write(object);
 // Use Wicket to ingest the new geometry's WKT
 let wicket = new Wkt.Wkt();
 wicket.read(wkt);
 // Assemble your new polygon's options,I used object notation
 let polyOptions = {
   strokeColor: 'black',strokeOpacity: 0.8,strokeWeight: 2,fillColor: color,fillOpacity: opacity
 };
 // Let wicket return a Google Polygon with the options you set above
 let poly = wicket.toObject(polyOptions);
 return poly;
}

执行上述方法时出现以下错误：

ERROR TypeError: Ht.toLineString is not a function

  1. 使用turf.js 

     CheckIntersections() {
 for (let i = 0; i < this.OverlappedPolygons.length; i++) { // Here I am having array of Overlapped Polygons
   let selected = this.OverlappedPolygons[i].getPath().getArray();
   let array1 = [];
   for (let j = 0; j < selected.length; j++) {
     let dt = selected[j];
     let m = [];
     m.push(dt.lat());
     m.push(dt.lng());
     array1.push(m);
   }
   let polygon1 = this.convert(array1);
   for (let k = 0; k < this.OverlappedPolygons.length; k++) {
     if (this.OverlappedPolygons[i].id.trim().toUpperCase() !== this.OverlappedPolygons[k].id.trim().toUpperCase()) {
       let selected2 = this.OverlappedPolygons[k].getPath().getArray();
       let array2 = [];
       for (let j1 = 0; j1 < selected2.length; j1++) {
         let dt = selected2[j1];
         let m = [];
         m.push(dt.lat());
         m.push(dt.lng());
         array2.push(m);
       }
       let polygon2 = this.convert(array2);
       if (turf.intersect(polygon2,polygon1)) {
         let intersect = turf.intersect(polygon2,polygon1);
         if (intersect.geometry.type === 'Polygon') {
           let new1 = turf.difference(polygon1,intersect.geometry);
           let new2 = turf.difference(polygon2,intersect.geometry);
           let array = [];
           for (let j = 0; j < intersect.geometry.coordinates[0].length; j++) {
             array.push({
               'lat': intersect.geometry.coordinates[0][j][0],'lng': intersect.geometry.coordinates[0][j][1],});
           }
           let poly1 = this.ShowPolygon(array);
           poly1.setMap(this.map);
           this.NewPolygonsArray.push(poly1);
           poly1.setOptions({ fillColor: 'red',fillOpacity: 0.8 });
           array = [];
           if (new1.geometry.type === 'MultiPolygon') {
             for (let j = 0; j < new1.geometry.coordinates.length; j++) {
               for (let j1 = 0; j1 < new1.geometry.coordinates[j][0].length; j1++) {
                 array.push({
                   'lat': new1.geometry.coordinates[j][0][j1][0],'lng': new1.geometry.coordinates[j][0][j1][1],});
               }
               let poly2 = this.ShowPolygon(array);
               poly2.setOptions({ fillColor: 'black',fillOpacity: 0.2 });
               poly2.setMap(this.map);
               array = [];
             }
           } else {
             for (let j = 0; j < new1.geometry.coordinates[0].length; j++) {
               array.push({
                 'lat': new1.geometry.coordinates[0][j][0],'lng': new1.geometry.coordinates[0][j][1],});
             }
             let poly2 = this.ShowPolygon(array);
             poly2.setOptions({ fillColor: 'black',fillOpacity: 0.2 });
             poly2.setMap(this.map);
             array = [];
           }
           if (new2.geometry.type === 'MultiPolygon') {
             for (let j = 0; j < new2.geometry.coordinates.length; j++) {
               for (let j1 = 0; j1 < new2.geometry.coordinates[j][0].length; j1++) {
                 array.push({
                   'lat': new2.geometry.coordinates[j][0][j1][0],'lng': new2.geometry.coordinates[j][0][j1][1],});
               }
               let poly3 = this.ShowPolygon(array);
               poly3.setOptions({ fillColor: 'black',fillOpacity: 0.2 });
               poly3.setMap(this.map);
               array = [];
             }
           } else {
             for (let j = 0; j < new2.geometry.coordinates[0].length; j++) {
               array.push({
                 'lat': new2.geometry.coordinates[0][j][0],'lng': new2.geometry.coordinates[0][j][1],});
             }
             let poly3 = this.ShowPolygon(array);
             poly3.setOptions({ fillColor: 'black',fillOpacity: 0.2 });
             poly3.setMap(this.map);
             array = [];
           }
         }
       }
     }
   }
 }
}
convert(points) {
   let geojson = { 'type': 'Polygon','coordinates': [points] };
   return geojson;
}
ShowPolygon(coords) {
 let poly = new google.maps.Polygon({
   path: coords,strokeColor: 'black',fillColor: '' + this.getRandomColor(),fillOpacity: 0.2,editable: false
 });
 return poly;
}

对于上面的一个，我得到以下错误：

ERROR TypeError: this.seg.p1.equals2D is not a function

我正在尝试两种方法，但是都遇到了问题。为此工作了超过一天。

请帮助我解决这个问题。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

angulargoogle-mapsjavascriptturfjs