如何使用 GeoJSON 将线串/折线添加到自定义 MapBox 模板

Question

我目前正在从 MapBox 修改商店定位器模板： https://github.com/mapbox/foursquare-store-locator https://www.mapbox.com/blog/foursquare-store-locator/

问题在于向这个修改后的框架添加线串/多段线。

例如，我无法使用以下格式添加带有线串 GeoJSON 数据的新地图图层：

L.map('map').

我可以让线串与 leafllet.js 一起使用：

---

http://jsfiddle.net/xpancom/hUy5g/16/

---

...但这利用了“L”。来自 Leaflet.js 并且在修改后的 MapBox 模板中不起作用。

L.geoJson(myLine1, {style: myStyle}).addTo(map);

问题是来自 MapBox 的修改后的商店定位器应用似乎没有实现相同的接口。

这是我当前尝试添加具有线串的图层的代码：

foursquare.lines = function() {

  var lines = { 'type': 'FeatureCollection',
        'features': []
    };

lines.features.push({
            type: 'Feature',
           // id: venue.id,
            geometry: {
                type: 'LineString',
                coordinates: [[
            60.317769,
            24.929009
          ],
          [
            24.9292486208828,
            60.1681323558666
          ],
          [
            24.951764345169067,
            60.168932342858554
          ],
          [
            24.93321418762207,
            60.16911913731421
          ],
          [
            24.952929,
            60.167312
          ],
          [
            24.944114685058594,
            60.170111798603266
          ],
          [
            24.94499444961548,
            60.171435300334004
          ]]
            },
            properties: {}

        }); //push

//console.log(lines);

if (MM_map.lineLayer) {
        MM_map.lineLayer.geojson(lines);
        alert("hi");
    } else {
        MM_map.lineLayer = mmg().geojson(lines);
        //alert("hello");
        console.log(lines);
    }

 MM_map.addLayer(MM_map.lineLayer);

  }; //foursquare.lines

图层被添加为空 div，但 geojson 和 lines 对象没有得到处理，也没有显示。

当我运行 console.log(lines) 时，我正确获取了所有 geojson 数据，只是没有使用这一行添加：

mmg().geojson(lines)

我真的很感激这方面的任何帮助。谢谢

Answer 1

foursquare 商店定位器示例基于 MapBox.js v0.6.7，而您尝试使用 v1.x 及更高版本的代码。您要么需要查阅 v0.6.7 文档，要么从不同的起点开始，这是我建议的 - 例如，请参阅 the MapBox.js examples。