[英]Leaflet.js geoJson not appearing on map - Im trying to show directions
I am able to retrieve directions fine using the cloudmade api but I cant seem to add those coordinates to my map. 我可以使用cloudmade api很好地检索路线,但似乎无法将这些坐标添加到地图中。
I've tried two different approaches 我尝试了两种不同的方法
var myStyle = {
"color": "#ff7800",
"weight": 5,
"opacity": 0.65
};
var myLines = [{
"type": "LineString",
"coordinates": []
}];
myLines.coordinates = [[]];
for (var i = result.data.route_geometry.length - 1; i >= 0; i--) {
if(!isNaN(result.data.route_geometry[i][0]) && !isNaN(result.data.route_geometry[i][1])){
myLines.coordinates[i] = [result.data.route_geometry[i][0], result.data.route_geometry[i][1]];
}
};
L.geoJson(myLines, {style: myStyle}).addTo(window.map);
and 和
var geojsonFeature = {
"type": "Feature",
"properties": {
"name": "Coors Field",
"amenity": "Baseball Stadium",
"popupContent": "This is where the Rockies play!"
},
"geometry": {
"type": "Point",
"coordinates": []
}
};
for (var i = result.data.route_geometry.length - 1; i >= 0; i--) {
if(!isNaN(result.data.route_geometry[i][0]) && !isNaN(result.data.route_geometry[i][1])){
geojsonFeature.geometry.coordinates[i] = [result.data.route_geometry[i][0], result.data.route_geometry[i][1]];
}
};
L.geoJson(geojsonFeature).addTo(window.map);
I am able to add markers fine. 我可以添加标记。 My question is similar to this one Leaflet GeoJSON display and so I've tried reversing the coordinates like this
我的问题类似于该Leaflet GeoJSON显示 ,因此我尝试像这样反转坐标
myLines.coordinates[i] = [result.data.route_geometry[i][0], result.data.route_geometry[i][1]];
but I still get nothing added to the map. 但我仍然没有在地图上添加任何内容。
No errors in the console. 控制台中没有错误。
This is the correct way to do this: http://jsfiddle.net/8QHFe/153/ 这是执行此操作的正确方法: http : //jsfiddle.net/8QHFe/153/
var linePts = [
[ 31.811628, 24.904771 ],
[ 31.810856, 24.91096 ],
[ 31.817636, 24.911855 ],
[ 31.831133, 24.907477 ],
[ 31.841497, 24.898679 ],
[ 31.841025, 24.895312 ],
[ 31.837935, 24.891225 ],
[ 31.842356, 24.889006 ],
[ 31.853814, 24.888626 ]
];
// a FOR loop operates on each item in a list
for( i=0; i < linePts.length; i=i+1 ) {
// turn this coordinate into a LatLng
linePts[ i ] = new L.LatLng( linePts[ i ][ 0 ], linePts[ i ][ 1 ] );
}
// add the line
line = new L.Polyline( linePts, { color: "purple" } );
map.addLayer(line);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.