Google地圖上的多個多邊形-不起作用-合並

Question

使用下面的代碼，我可以在地圖上繪制一個多邊形，但是這些多邊形被視為一個，而api將它們連接起來就像在多邊形上一樣。 我一直在撞我的頭！ 我需要每個多邊形在地圖上加載不同的形狀。 數組內部的格式如下：

[[11.11,11.11],[22.22,22.22],[33.33,33.33]]

的

[[[11.11,11.11],[22.22,22.22],[33.33,33.33]],[[11.11,11.11],[22.22,22.22],[33.33,33.33]]]




var polys = [[[51.4503639, -0.1006082], [51.4502851, -0.1000704], [51.4491791, -0.0992159], [51.4480629, -0.0978004], [51.4486121, -0.098658], [51.4503639, -0.1006082]], [[51.4225526, -0.1618125], [51.42297, -0.160525], [51.4222314, -0.1603534], [51.421847, -0.1590405], [51.4216169, -0.1583023], [51.4198131, -0.1587487], [51.4196633, -0.1579333], [51.4195509, -0.1571436], [51.4188674, -0.1577788], [51.4190548, -0.1585427], [51.4189852, -0.1594954], [51.4182427, -0.1601064], [51.4175419, -0.1606966], [51.416929, -0.1618334], [51.4175821, -0.1618763], [51.4183207, -0.1624428], [51.4181762, -0.1640049], [51.4182297, -0.1646916], [51.4191932, -0.1649233], [51.4204705, -0.1644732], [51.4211931, -0.1643445], [51.4216213, -0.1642758], [51.4209897, -0.1643016], [51.4201781, -0.163241], [51.4214072, -0.1623876], [51.4219531, -0.1621987], [51.4220602, -0.1621558], [51.4225526, -0.1618125]]]

  var latLng =[]
  var locs = []

  for (var _p=0; _p < polys.length; _p++) {
      locs = polys[_p];

      for (_i = 0, _len = locs.length; _i < _len; _i++) {
          point = locs[_i];
          latLng.push(new google.maps.LatLng(point[0], point[1]));}

          bermudaTriangle = new google.maps.Polygon({
           paths: latLng,
           fillColor: "#FF0000",
           fillOpacity:0.1
           });
  }
          bermudaTriangle.setMap(map);


  }

最后，它起作用了：

  var latLng =[]
  var locs = []
  for (var _p=0; _p < polys.length; _p++) {
      locs = polys[_p];
      var  latLng = [];
      var bermudaTriangle = []
    for (_i = 0, _len = locs.length; _i < _len; _i++) {

            point = locs[_i];
            latLng.push(new google.maps.LatLng(point[0], point[1]));}


    bermudaTriangle = new google.maps.Polygon({
               paths: latLng,
               fillColor: "#FF0000",
               fillOpacity:0.1
    });

    bermudaTriangle.setMap(map);
     }

    }

Answer 1

您應該將調用移到內部循環之外創建多邊形。 並且您需要每次重新創建latLng數組。

var latLng =[];

for (_i = 0, _len = locs.length; _i < _len; _i++) {
          point = locs[_i];
          latLng.push(new google.maps.LatLng(point[0], point[1]));}
}

bermudaTriangle = new google.maps.Polygon({
           paths: latLng,
           fillColor: "#FF0000",
           fillOpacity:0.1
});

bermudaTriangle.setMap(map);