GoogleMaps API V3构建包含多个Zipcode的多边形

Question

我必须允许用户输入多个邮政编码，从数据库中检索纬度和经度，然后构建一个包含它们的巨大多边形。

我需要在代码中修改什么才能将所有这些较小的多边形变成一个较大的多边形？我在谷歌上搜索过答案，我所能找到的只是逐个构建每个邮政编码的多边形，但这仍然不能给我一个更大、单个多边形的最终结果。

目前，输入邮政编码后，程序从数据库中收集lat和long点，并将它们输入一个巨大的数组（确切地说是字符串[][]），然后将其传递给html和javascript生成生成的多边形。

我的javascript是高度相似的GoogleMaps API V3简单多边形的例子：

function clearHello(coords1){
coords = coords1
var triangleCoords = new Array();
var l = coords.length;
for (var x = 0; x < l; x++){
triangleCoords[x] = new google.maps.LatLng( coords[x][0], coords[x][1]);
}
// Construct the polygon.
bermudaTriangle = new google.maps.Polygon({
paths: triangleCoords,
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#FF0000',
fillOpacity: 0.35
});
bermudaTriangle.setMap(document.map);

建议？有没有一种代码技术可以拿走我的巨大数组，然后删除似乎是造成这种扭曲的内部点？

编辑：想知道一种不同的方法，有没有人知道一种方法来去除产生奇怪梯形的内线，这样邮政编码多边形就可以正确填充了？我知道我可以让它们透明，但这并不能阻止多边形的扭曲。同样，简单地将其管理为我填充的几个多边形是行不通的，因为这个程序需要能够一次处理多达200个邮政编码的坐标。

Answer 1

解决方案是使用GeoJson来表示你想要的，并且有一个API，所以你不必担心后端或多边形中的任何失真，如下图。：

这里：www.boundaries-io.com

示例查询：

/rest/v1/public/boundary？30044,30043,30045

您还可以在一行代码中查询多个县、市等。

简单的java脚本：https://developers.google.com/maps/documentation/javascript/datalayer#sample_geojson

...map.data.loadGeoJson（'.../rest/v1/公共/边界？邮编=30044,30042,30045）；...

*****我为公司工作*

Answer 2

你可以试试javascript。一个好的开始也是一个凹壳。我已经编写了一个php类@phpclasses。组织。它取一组点，用凹壳算法找到凹壳。基本上这是一个delaunay三角化，你可以删除最长的边。你也可以在这里阅读我的答案：从Delaunay三角剖分计算alpha形状的边界多边形。

Answer 3

听起来你想要删除共享边界并创建一种宏对象。在地理信息系统的土地上，这种操作被称为“溶解”。您可以将两个第三方库组合在一起，专门在JavaScript代码中执行您想要的操作。

如何做一个地理信息系统溶解在JavaScript

您可以结合Wicket和JavaScript拓扑套件（JSTS）库来执行联合/解散操作，并导出具有统一外部边界的单个多边形几何形状。

简单来说，Wicket将处理从Google Maps多边形对象到众所周知的文本（WKT）几何表达式的往返，然后JST可以使用WKT执行并集/融合操作。

初步步骤：下载这两个库并在项目中引用它们。

1） 首先下载JSTS库，解压缩它，浏览到lib文件夹，并在项目中包含两个lib文件（javascript.util.js，和JSTS.js）。我把我的复制到一个单独的jsts文件夹中，并在我的项目中引用它们，如下所示。。

<script type="text/javascript" src="jsts/javascript.util.js"></script>
<script type="text/javascript" src="jsts/jsts.js"></script>

2） 接下来下载Wicket库，解压它，并包含Wicket。js和wicket-gmap3。js在您的项目中。同样，我把我的复制到一个单独的wicket文件夹中，并像这样引用它们。。

<script type="text/javascript" src="wicket/wicket.js"></script>
<script type="text/javascript" src="wicket/wicket-gmap3.js"></script>

使用Wicket获取多边形WKT几何，然后使用JSTS执行溶解操作。

3）将这两个库联合起来，从Wicket获得众所周知的文本几何，并使用JSTS执行溶解操作。

我的演示假设已经实例化了两个Google多边形对象，并将它们传递到方法中——polygon1和polygon2。显然，这只是一个简单的示例，因此您需要对其进行修改，以实现更复杂的操作。

function DissolveTwoGeometriesWithJSTS(polygon1, polygon2)
{
    // Instantiate Wicket
    var wicket = new Wkt.Wkt();

    wicket.fromObject(polygon1);  // import a Google Polygon
    var wkt1 = wicket.write();    // read the polygon into a WKT object

    wicket.fromObject(polygon2);  // repeat, creating a second WKT ojbect
    var wkt2 = wicket.write();

    // Instantiate JSTS WKTReader and get two JSTS geometry objects
    var wktReader = new jsts.io.WKTReader();
    var geom1 = wktReader.read(wkt1);
    var geom2 = wktReader.read(wkt2);

    // In JSTS, "union" is synonymous with "dissolve"
    var dissolvedGeometry = geom1.union(geom2);

    // Instantiate JSTS WKTWriter and get new geometry's WKT
    var wktWriter = new jsts.io.WKTWriter();
    var wkt = wktWriter.write(dissolvedGeometry);

    // Reuse your Wicket object to ingest the new geometry's WKT
    wicket.read(wkt);

    // Assemble your new polygon's options, I used object notation
    var polyOptions = {
        strokeColor: '#1E90FF',
        strokeOpacity: 0.8,
        strokeWeight: 2,
        fillColor: '#1E90FF',
        fillOpacity: 0.35    
    };

    // Let wicket create a Google Polygon with the options you defined above
    var newPoly = wicket.toObject(polyOptions);        

    // Now I'll hide the two original polygons and add the new one.
    polygon1.setMap(null);
    polygon2.setMap(null);

    newPoly.setMap(map);
}

基本上是这样的。在执行代码之前...

然后。。