Meteor：带有 mapbox 的反应式标记

Question

我目前正在尝试在 Mapbox 地图上反应性地显示标记。我的方法是观察一个集合，同时创建一个 GeoJSON 对象。但是，该特定对象的更改不会反映在地图上。

var featureArray = [];
CollectionName.find({}).observe({
  added: function(item) {
      featureArray.push({
        type: "Feature",
        geometry: {
          type: "Point",
          coordinates: [+item.location.coordinates[0], +item.location.coordinates[1]]
        },
        properties: {
          _id: item._id,
        }
      });
  },
  changedAt: function(newDocument, oldDocument, atIndex) {
    //..
  },
  removed: function(oldDocument, atIndex) {
    //..
  }
});

var CollectionGeoJSON = {
  'type': 'FeatureCollection',
  'features': testmarkers
};

var markers  = L.mapbox.featureLayer().setGeoJSON(CollectionGeoJSON);

// add cluster markers and add them to map

我的想法是手动 add/remove/change 客户端上的标记（因为无论如何更改都会同步到服务器），但是这里也没有成功，因为我不确定如何使用 Mapbox API.

非常感谢任何提示。

Answer 1

我创建了一个 meteorpad 示例，展示了这个。

通过在 onRendered 回调中调用 template.autorun 创建反应。 template.autorun 回调由 Cities.find() 结果的任何更改触发，并使用 .setGeoJSON

更新地图

this.autorun(function () {
  if (Mapbox.loaded()) {
    geojson = Cities.find().fetch()
    view.featureLayer.setGeoJSON(geojson);
  }
});

在此示例中，Cities 集合的内容已采用正确的格式传递给 .setGeoJSON，但如果您愿意，可以使用不同的 Colleciton 架构，并在其中以这种格式创建列表template.autorun 回调。

Meteor：带有 mapbox 的反应式标记

Meteor: Reactive markers with mapbox

meteor

mapbox