0

使用 Google Maps v3 API 可以分割同名的多边形

例如，我有一堆英国邮政编码协调到 XXX X 级别

假设我有 CR0 1 和 CR0 2 我想要一个名为 CR0 但在地图上拆分的多边形

这就是我所拥有的

var triangleCoords = [
new google.maps.LatLng(51.3552780000, -0.1162350000),
new google.maps.LatLng(51.3557810000, -0.1179340000),
new google.maps.LatLng(51.3572930000, -0.1171320000),
new google.maps.LatLng(51.3573480000, -0.1155220000),
new google.maps.LatLng(51.3573380000, -0.1154850000),
new google.maps.LatLng(51.3572730000, -0.1153750000),
new google.maps.LatLng(51.3557800000, -0.1149820000),
new google.maps.LatLng(51.3552780000, -0.1162350000)
];

和

var triangleCoords = [
new google.maps.LatLng(51.3749120000,-0.0897770000),
new google.maps.LatLng(51.3747190000, -0.0888120000), 
new google.maps.LatLng(51.3746020000, -0.0887410000), 
new google.maps.LatLng(51.3742810000, -0.0890390000), 
new google.maps.LatLng(51.3742740000, -0.0903670000), 
new google.maps.LatLng(51.3746260000, -0.0904120000), 
new google.maps.LatLng(51.3749120000, -0.0897770000) ];

我尝试将坐标放在一条路径中，但它们之间出现了一条奇怪的线

var triangleCoords = [ 
new google.maps.LatLng(51.3552780000, -0.1162350000), 
new google.maps.LatLng(51.3557810000, -0.1179340000), 
new google.maps.LatLng(51.3572930000, -0.1171320000), 
new google.maps.LatLng(51.3573480000, -0.1155220000), 
new google.maps.LatLng(51.3573380000, -0.1154850000), 
new google.maps.LatLng(51.3572730000, -0.1153750000), 
new google.maps.LatLng(51.3557800000, -0.1149820000), 
new google.maps.LatLng(51.3552780000, -0.1162350000), 
new google.maps.LatLng(51.3749120000, -0.0897770000), 
new google.maps.LatLng(51.3747190000, -0.0888120000), 
new google.maps.LatLng(51.3746020000, -0.0887410000), 
new google.maps.LatLng(51.3742810000, -0.0890390000), 
new google.maps.LatLng(51.3742740000, -0.0903670000), 
new google.maps.LatLng(51.3746260000, -0.0904120000), 
new google.maps.LatLng(51.3749120000, -0.0897770000) ]

  CR0_3 = new google.maps.Polygon({
      paths: triangleCoords,
      strokeColor: '#545fa4',
      strokeOpacity: 0.8,
      strokeWeight: 0.7,
      fillColor: '#545fa4',
      fillOpacity: 0.7
    });

这可以通过使用多几何在 KML 中实现 - 但我还没有弄清楚如何使用 google maps api

这个要求有意义吗？

4

1 回答 1

2

由于 CR0 的两个部分不连续，因此它们需要是单独的路径（多边形具有路径数组，如果将它们分开，则不会用连续线绘制）：

 var triangleCoords1 = [
 new google.maps.LatLng(51.3552780000, -0.1162350000),
 new google.maps.LatLng(51.3557810000, -0.1179340000),
 new google.maps.LatLng(51.3572930000, -0.1171320000),
 new google.maps.LatLng(51.3573480000, -0.1155220000),
 new google.maps.LatLng(51.3573380000, -0.1154850000),
 new google.maps.LatLng(51.3572730000, -0.1153750000),
 new google.maps.LatLng(51.3557800000, -0.1149820000),
 new google.maps.LatLng(51.3552780000, -0.1162350000)
 ];


 var triangleCoords2 = [
 new google.maps.LatLng(51.3749120000,-0.0897770000),
 new google.maps.LatLng(51.3747190000, -0.0888120000), 
 new google.maps.LatLng(51.3746020000, -0.0887410000), 
 new google.maps.LatLng(51.3742810000, -0.0890390000), 
 new google.maps.LatLng(51.3742740000, -0.0903670000), 
 new google.maps.LatLng(51.3746260000, -0.0904120000), 
 new google.maps.LatLng(51.3749120000, -0.0897770000) ];

 var CR0_3 = new google.maps.Polygon({
    map: map,
    paths: [triangleCoords1, triangleCoords2], 
    strokeColor: '#545fa4',
    strokeOpacity: 0.8,
    strokeWeight: 0.7,
    fillColor: '#545fa4',
    fillOpacity: 0.7
  });

工作示例

于 2012-11-07T17:52:34.490 回答