javascript - Leaflet.js geoJson 没有出现在 map 上 - 我试图显示方向

Question

我可以使用 cloudmade api 很好地检索方向，但我似乎无法将这些坐标添加到我的 map 中。

我尝试了两种不同的方法

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

但我仍然没有在 map 上添加任何内容。

控制台中没有错误。

Answer 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);​