我可以使用cloudmade api检索方向,但我似乎无法将这些坐标添加到我的地图中。
我尝试了两种不同的方法
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);
和
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);
我能够很好地添加标记。我的问题类似于这个问题Leaflet GeoJSON display,所以我试过像这样反转坐标
myLines.coordinates[i] = [result.data.route_geometry[i][0], result.data.route_geometry[i][1]];
但我仍然没有在地图上添加任何内容。
控制台没有错误。
答案 0 :(得分:1)
这是执行此操作的正确方法: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);