使用Google Maps API从JSON文件显示多边形

我能够将JSON文件加载到页面中(当前使用jQuery),并将内容设置为页面中的变量。

JSON包括对构建轮廓的引用,如下所示;

[ { "buildingNumber":"7", "buildingDescription":"Building Seven", "spatial":{ "points": [ "-1.2345678,50.9876543", "-1.2345677,50.9876544", "-1.2345676,50.9876545", "-1.2345675,50.9876546" ] } } ] 

使用jQuery的$.each ,我可以加载变量并遍历建筑物,另外,每个建筑物,我可以非常简单地遍历这些点。

问题在于,Google似乎只记录了以下用于描述多边形的方法;

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

这是有道理的,但我看不出如何从我目前拥有的数组到这种格式。 我真的很感激任何关于从一个移动到另一个的起点的指针,或者描述多边形的另一种方式。

我已经查看了array.push()函数,虽然看起来像是本地的方法,但我看不出如何根据数组中的迭代值动态创建变量。

谢谢

目前您的积分是字符串。 将它们转换为google.maps.LatLng对象:

 var point = "-1.2345678,50.9876543"; var coords = point.split(","); var pt = new google.maps.LatLng(parseFloat(coords[0]), parseFloat(coords[1])); 

然后将生成的google.maps.LatLng对象推送到多边形的“路径”数组中。

你有一个表示纬度和经度的字符串数组,你需要一个google.maps.LatLng数组。 我在这里使用array.map()函数 – docs 。

 var polyCoords = spatial.points.map(function(point) { var pointCoords = point.split(','); return new google.maps.LatLng( parseFloat(pointCoords[0]), parseFloat(pointCoords[1])); });