Google Maps v3 API可以用来拆分多边形，但保留一个名称空间吗？ [英] Can Google Maps v3 API be used to split a polygon but keep one namespace?

问题描述

使用Google Maps v3 API有一种方法可以将同名的多边形进行分割。例如，我为英国邮政编码协调了一大堆XXX X级别

说我有CR0 1和CR0 2我想要一个名为CR0的多边形，但在地图上分割

这是我的

  var triangleCoords = [
 new google.maps.LatLng（51.3552780000，-0.1162350000） ，
新google.maps.LatLng（51.3557810000，-0.1179340000），
新google.maps.LatLng（51.3572930000，-0.1171320000），
新google.maps.LatLng（51.3573480000，-0.1155220000 ），
新google.maps.LatLng（51.3573380000，-0.1154850000），
新google.maps.LatLng（51.3572730000，-0.1153750000），
新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），
新google.maps.LatLng（51.3742810000，-0.0890390000），
新google.maps.LatLng（51.3742740000，-0.0903670000），
新谷歌。 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），
新google.maps.LatLng（51.3572930000，-0.1171320000），
新google.maps.LatLng（51.3573480000，-0.1155220000），
新google.maps。 LatLng（51.3573380000，-0.1154850000），
新google.maps.LatLng（51.3572730000，-0.1153750000），
新google.maps.LatLng（51.3557800000，-0.1149820000），
新google.maps .LatLng（51.3552780000，-0.1162350000），
新google.maps.LatLng（51.3749120000，-0.0897770000），
新google.maps.LatLng（51.3747190000，-0.0888120000），
新谷歌。 maps.LatLng（51.3746020000，-0.0887410000），
新google.maps.LatLng（51.3742810000，-0.0890390000），
新google.maps.LatLng（51.3742740000，-0.0903670000），
新谷歌.maps.LatLng（51.3746260000，-0.0904 120000），
 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中实现 - 但我曾经研究过如何实现与谷歌地图api

请问这个请求是否有意义？

解决方案

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

  var triangleCoords1 = [
 new google.maps.LatLng（51.3552780000，-0.1162350000），
 new google.maps.LatLng（51.3557810000， -0.1179340000），
新google.maps.LatLng（51.3572930000，-0.1171320000），
新google.maps.LatLng（51.3573480000，-0.1155220000），
新google.maps.LatLng（51.3573380000 ，-0.1154850000），
新google.maps.LatLng（51.3572730000，-0.1153750000），
新google.maps.LatLng（51.3557800000，-0.1149820000），
新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 
}）; 
  

工作示例

Using Google Maps v3 API is there a way to split polygons under the same name

For example I have a bunch of coordinated for the UK postcodes down to XXX X level

Say I have CR0 1 and CR0 2 I would like one polygon named CR0 but split on the map

this is what I had

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)
];

and

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) ];

I tried putting the coordinates into one path but I get a strange line between them

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
    });

This can be achieved in a KML by using multi geometry - but I havnt worked out how to do it with google maps api

Does this request make sense?

解决方案

Since the two parts of CR0 are not contiguous, they need to be separate paths (a polygon has an array of paths, if you make them separate they won't be drawn with a continuous line):

 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
  });

Working example

这篇关于Google Maps v3 API可以用来拆分多边形，但保留一个名称空间吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！