Question

我正在尝试从使用杂食动物和markercluster插件解析的csv中集群数据，但没有任何反应。当我不使用插件时，我可以看到所有标记......

我看到很多例子like this，但他们都使用了mapbox，我构建了一个纯粹的传单地图。我也tried this但我的问题仍然存在。

我的控制台中的所有内容都是我的csv的“语法错误”，但这不是核心问题。

我的csv看起来像这样：

date,dcomiris,latitude,longitude,infra,iris,com,name
2014-01-01,600570101,49.4295880722704,2.08997269112341,7871F,Cathedrale-Universite,60057,Beauvais

我的代码现在看起来像这样：

var map = L.map('map').fitBounds([[49.072667, 1.653442],[49.737499, 3.158569]]);

L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
}).addTo(map);

var points = omnivore.csv('my.csv');
// points.addTo(map);

var markers = new L.markerClusterGroup({showCoverageOnHover:false});
markers.addLayer(points);
map.addLayer(markers);

我错过了什么？

Answer 1

关键步骤是来自cited tutorial的.on('ready', callback)。

Leaflet-omnivore异步访问您的CSV文件，因此您将points变量在添加到markers群集组时仍为空。

var points = omnivore.csv('my.csv');
//points.addTo(map);

var markers = L.markerClusterGroup({
  showCoverageOnHover: false
});

map.addLayer(markers);

points.on('ready', function () {
  console.log(points.getLayers().length)
  markers.addLayer(points);
});

演示：http://plnkr.co/edit/UJfvxQmT3OnGxFw4DtCd?p=preview

使用传单和杂食动物从csv聚类标记

1 个答案: