Leaflet.timeline geojson 解析错误

Question

尝试实现 Leaflet.timeline 并遇到 GeoJSON 结构或其他问题。

为了简化调试，我将 geojson 添加为 var（实际上它是由 Rails 动态创建的）。这是开始：

 var data = [{"type":"FeatureCollection","features":[{"type":"Feature","properties":{"start":"1903","end":"1908","name":"part of S. Toluca St. (26). and second block south gone","title":"Was Brook before 1903 and now is part of S. Toluca St. (26). and second block south gone 1908.","link=":91},"geometry":{"type":"LineString","coordinates":[[-118.25862396508458,34.06087254304104],[-118.25933206826451,34.05994816216629]]}},{"type":"Feature","properties":{"start":"1903","end":"1928","name":"part of E. 40th Place","title":"Was 37th St before 1903 and now is part of E. 40th Place 1928.","link=":650},"geometry":{"type":"LineString","coordinates":[[-118.25712423772116,34.01007010760971],[-118.25649456380442,34.01016443793837],[-118.25584971702219,34.01016443793837],[-118.25427932544667,34.0102021700405],[-118.25213995141625,34.010227324765935]]}},{"type":"Feature","properties":{"start":"1903","end":"1908","name":"part of E. 9th Place (21).","title":"Was 10th St.  before 1903 and now is part of E. 9th Place (21). 1908.","link=":3},"geometry":{"type":"LineString","coordinates":[[-118.24982816353442,34.035546195508864],[-118.25104052200915,34.03663976724366]]}},{"type":"Feature","properties":{"start":"1921","end":"","name":"Miramar St. One block abandoned","title":"Was 3rd St before 1921 and now is Miramar St. One block abandoned .","link=":645},"geometry":{"type":"LineString","coordinates":[[-118.26117539280003,34.05901974362122],[-118.2593849946753,34.05823410691563],[-118.25815599257271,34.05768101430694],[-118.25759459655055,34.05717191451128],[-118.25663111959356,34.05654339202722]]}},{"type":"Feature","properties":{"start":"1928","end":"1930","name":"Commonwealth Pl and a portion abandoned","title":"Was Auto Pl before 1928 and now is Commonwealth Pl and a portion abandoned 1930.","link=":50},"geometry":{"type":"LineString","coordinates":[[-118.28558737412096,34.07543021182353],...

我在 Leaflet.timeline 中到达这里：

_process(data) {
  data.features.forEach((feature) => {

看着data：

换句话说，它似乎是完整的和被理解的。如果从这里运行它会失败并显示Uncaught TypeError: Cannot read property 'forEach' of undefined，所以重新加载并停止；并在控制台data[0].features

最后是控制台中的data[0].features.forEach(feature)：

我做错了什么或者我还应该检查什么？ geojson 适用于var segmentLayer = L.mapbox.featureLayer().loadURL('overview_data.geojson').addTo(laMap);，但我想添加一个时间滑块。

不是直接回答，但我解决了阅读 GeoJSON 的更大问题。正如我在Reading a GeoJSON file into Rails/Leaflet 中所说，我用

读取了 GeoJSON

$.getJSON("overview/overview_data.json", function (data) {
   <all the stuff I needed to to>
} )

虽然看起来一样，但我必须对 GeoJSON 进行了一些重组，因为这里提到的问题已经消失了。

Answer 1

很可能您不应该将特征集合包装在数组中。

虽然 Leaflet 的 L.geoJSON 工厂确实也接受 GeoJSON 对象数组，但 Leaflet.timeline 插件似乎并非如此：它尝试直接读取 data.features，就好像 data 是一个单一的特征集合，而您将 data 作为特征集合数组传入。

在您的调试中，您甚至可以明确查看此数组的一项：data[0].features

最后，如果你写forEach(feature)，JS 引擎期望feature 是一个函数（forEach 的回调），而不是一个函数参数，如果你写了forEach(feature => {console.log(feature);}

因此，您可以非常简单地重构一点您的 Rails 后端以发送单个功能集合对象，而不是包装在数组中。