使用Google Maps API显示来自JSON文件的多边形 [英] Displaying polygons from JSON file with Google Maps API

问题描述

我可以将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（）函数，虽然看起来像是本地方法，但我看不到如何根据数组中的迭代值动态创建变量。 p>

谢谢

解决方案

目前你的观点是字符串。将它们转换为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对象推送到您的用于多边形的路径数组中。 / p>

I'm able to load a JSON file into a page (currently using jQuery), and set the content as a variable in the page.

The JSON includes references to building outlines, as follows;

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

Using jQuery's $.each, I can load the variable and iterate through the buildings, additionally, per building, I can iterate through the points quite simply.

The problem comes with the fact that Google only appear to document the following method for describing polygons;

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

That makes sense, but I can't see how to get from the arrays I currently have to this format. I'd really appreciate any pointers on where to start in moving from one to the other, or another way to describe the polygons.

I've looked into the array.push() function, and while it seems like the locical way to go, I can't see how to dynamically create variables based on the iterative values from the array.

Thanks

解决方案

Currently your points are strings. Convert them to google.maps.LatLng objects:

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

Then push the resulting google.maps.LatLng objects onto your "path" array for the Polygons.

这篇关于使用Google Maps API显示来自JSON文件的多边形的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！