Google Maps API多边形,中心有"洞"

Dav*_*ann 14 google-maps polygon google-maps-api-3

在另一个多边形内插入一个多边形应该在中心形成一个"洞"(参见谷歌地图五角大楼的例子).但是,我的程序仍然无法创建一个洞,而是使两层多边形线变为不可靠.

http://cl.ly/1c243E1V1G2M1D3H3c0O < - 我地图的图片

有人说改变坐标顺序解决了他们的问题,所以我选择了谷歌在他们的例子中给出的百慕大三角坐标,但是,它遇到了我之前遇到的同样的问题.相关代码如下:

    var everythingElse = [
       new google.maps.LatLng(25.774252, -82.190262),
       new google.maps.LatLng(17.466465, -65.118292),
       new google.maps.LatLng(34.321384, -63.75737),
       new google.maps.LatLng(25.774252, -82.190262)
     ];

    var circleOverlay = [
       new google.maps.LatLng(25.774252, -80.190262),
       new google.maps.LatLng(18.466465, -66.118292),
       new google.maps.LatLng(32.321384, -64.75737),
       new google.maps.LatLng(25.774252, -80.190262)
     ];

    PropertySearch.tintPolygon = new google.maps.Polygon({
         paths: [ everythingElse, circleOverlay ],
        strokeColor: "#000000",
        strokeOpacity: 0.8,
        strokeWeight: 2,
        fillColor: "#000000",
        fillOpacity: 0.5
    });

    PropertySearch.tintPolygon.setMap(PropertySearch.map);
Run Code Online (Sandbox Code Playgroud)

sla*_*win 26

它实际上是多边形中指数方向的问题,而一个是顺时针方向,其他应该是逆时针方向.将您的第二个数组更改为:

var circleOverlay = [
   new google.maps.LatLng(25.774252, -80.190262),
   new google.maps.LatLng(32.321384, -64.75737),  //second and third coordinates
   new google.maps.LatLng(18.466465, -66.118292), //are swapped compared to your original
   new google.maps.LatLng(25.774252, -80.190262)
 ];
Run Code Online (Sandbox Code Playgroud)

它会在你的三角形中显示一个漂亮的洞