多边形谷歌地图中的多个孔在迭代数组时

Multiple Holes in Polygon Google Maps when iterating over array

本文关键字：迭代 数组 谷歌地图 多边形      更新时间：2023-09-26

我有下面的代码：

while p < points.length
  locs = points[p]
  latLng = [] 
  i = 0
  len = locs.length
  while i < len
    point = locs[i]
    latLng.push new google.maps.LatLng(point[0], point[1])
    i++
  marker = new google.maps.Polygon(
   paths: latLng
   fillColor: "#000000",
   fillOpacity: 0
   map: @gMap
  )
  markers.push(marker)
  p++

它通过一个绘制许多独立多边形的数组进行迭代。它工作得很好。但是，当我尝试引入许多多边形会在其中打洞的"容器多边形"时，我被难住了。我在这里了解演示...

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

我知道你可以有两条路。但是，我遍历了我的多边形构建器，所以我得到的是一张非常黑的地图，因为它不断重绘他的容器。

我试图得到的是一个 0.5 不透明度的容器，它有孔，这些孔是正在迭代的较小多边形。编辑 1：如果我只使用一个形状，我可以为这些多个形状获得所需的效果。我想我需要将所有路径移动到它们自己的变量中，然后将它们放入地图中？

我看不出您如何在代码片段中构造多边形。

但是，对于具有孔洞的多边形，每个单独的路径都需要是定义多边形的数组中的一个条目。对于具有四个孔的多边形，您需要在一个多边形内定义五条路径。

为了使孔在支持 Canvas 图形的浏览器中正确显示，必须考虑缠绕方向：每个孔应以与包含它的多边形相反的方向定义。也就是说，对于由顺时针方向的点定义的包含多边形，它包含的每个孔都需要逆时针定义。

相关文章：