访问嵌套geojson文件中的坐标以使用Google Maps API v3绘制多边形 [英] Accessing Coordinates in a nested geojson file to draw polygons with Google Maps API v3
问题描述
我试图从geojson文件中绘制多个多边形，真的很痛苦。下面我粘贴了一个geojson文件样本和用于访问它的javascript。这似乎是我遇到的主要问题是我无法进入嵌套在每个记录中的坐标数组，因为它要么返回坐标未定义的错误，要么没有未定义的方法setMap。我已经能够返回类似JSON文件的其他嵌套方面（这是一个测试文件，真正的实际上有数据，只是试图在这里获取多边形图），但获取这些坐标不起作用。我不是一个JavaScript大师，所以我不知道代码无法正确访问。
I am having a real pain of trying to draw multiple polygons from a geojson file. Below I have pasted a sample of the geojson file and the javascript used to access it. It seems the main problem I am running into is that I cannot get into that array of coordinates nested in each record as it either returns the error that "coordinates" is undefined or that there is no method "setMap" for undefined. I have been able to return other nested aspects of a similar JSON file (this is a test file, the real one actually has data, just trying to get the polygon drawing here), but getting those coordinates is not working. I am not a javascript master so I can't tell where the code is failing to make the proper access.
感谢您提前。
json数据如下所示：
the json data looks like this:
var data={
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"id": 1,
"properties": {
"Name": "",
"description": "",
"timestamp": "",
"begin": "",
"end": "",
"altitudeMode": "clampToGround",
"tessellate": 1,
"extrude": -1,
"visibility": -1
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[
-83.126571,
42.348706
],
[
-83.126520,
42.348634
],
[
-83.126516,
42.348635
],
[
-83.126147,
42.348778
],
[
-83.126144,
42.348780
],
[
-83.126195,
42.348852
],
[
-83.126199,
42.348851
],
[
-83.126568,
42.348708
],
[
-83.126571,
42.348706
]
]
]
}
},
{
"type": "Feature",
"id": 2,
"properties": {
"Name": "",
"description": "",
"timestamp": "",
"begin": "",
"end": "",
"altitudeMode": "clampToGround",
"tessellate": 1,
"extrude": -1,
"visibility": -1
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[
-83.132805,
42.356496
],
[
-83.132753,
42.356423
],
[
-83.132751,
42.356424
],
[
-83.132243,
42.356624
],
[
-83.132241,
42.356625
],
[
-83.132294,
42.356698
],
[
-83.132296,
42.356697
],
[
-83.132802,
42.356497
],
[
-83.132805,
42.356496
]
]
]
}
},
{
"type": "Feature",
"id": 3,
"properties": {
"Name": "",
"description": "",
"timestamp": "",
"begin": "",
"end": "",
"altitudeMode": "clampToGround",
"tessellate": 1,
"extrude": -1,
"visibility": -1
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[
-83.126776,
42.351813
],
[
-83.126492,
42.351413
],
[
-83.126189,
42.351525
],
[
-83.126191,
42.351528
],
[
-83.126376,
42.351807
],
[
-83.126776,
42.351813
]
]
]
}
}
etc...
]
}
使用geojason.info中使用的示例： http：// demos。 geojason.info/complex-geojson-polygons-google-maps-demo.php
I've got the javascript as below, using the example used at geojason.info: http://demos.geojason.info/complex-geojson-polygons-google-maps-demo.php
var points;
var pointsMore;
var polygon;
var map;
function initializeMap() {
map = new google.maps.Map(document.getElementById("map_canvas"), {
zoom: 11,
center: new google.maps.LatLng(42.347727, -83.058014),
mapTypeId: google.maps.MapTypeId.TERRAIN
});
var polygon = createPolygons(pointsMore);
//this is where the problem is...check nesting.
polygon.setMap(map);
}
function createPolygons(pointsMore) {
for (var y = 0; y < data.features.length; y++) {
var points = data.features[y];
for (var z = 0; points.geometry.length; z++) {
var pointsMore = points.geometry[z];
var coords = pointsMore.coordinates;
var paths = [];
$.each(coords,function(i,n){
$.each(n, function(j,o){
var path = [];
$.each(o,function(k,p){
var ll = new google.maps.LatLng(p[1],[0]);
path.push(ll);
});
paths.push(path);
});
});
var polygon = new google.maps.Polygon({
paths: paths,
strokeColor: "#FF7800",
strokeOpacity: 1,
strokeWeight: 2,
fillColor: "#46461F",
fillOpacity: 0.25
});
return polygon;
}
}
}
推荐答案
points.geometry 是一个对象，但您试图像数组一样循环它。要访问坐标，请使用：
points.geometry is an object, but you're trying to loop through it like an array. To access the coordinates, use:
var coordinates = data.features[y].geometry.coordinates;
这篇关于访问嵌套geojson文件中的坐标以使用Google Maps API v3绘制多边形的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
