在Mapbox / Leaflet上进行聚类标记

Question

我正在尝试在Mapbox上设置一个集群地图，类似于http://leaflet.github.io/Leaflet.markercluster/example/marker-clustering-realworld.388.html

但是他们的示例使用一个简单的.js文件作为数据来源http://www.mapbox.com/mapbox.js/assets/realworld.388.js

而我从Mapbox获取的唯一东西就是.geojsonhttp://api.tiles.mapbox.com/v3/thebteam.map-w9jzcznw/markers.geojson

是否有一种方法可以将GeoJSON转换为JS（定期）？或者从Mapbox导出JavaScript数组？

编辑：最终我把我的数据切换到CSV，并找到了一个解析器。如果有人需要，这是可行的代码：

var url = 'https://docs.google.com/spreadsheet/pub?key=abc123';

$.get(url, function(data) {
  var addressPoints = $.csv.toArrays(data);
  var map = L.mapbox.map('map', 'map-abc123').setView([20.30, 18.98], 2);
  var markers = new L.MarkerClusterGroup({ showCoverageOnHover: false });

  for (var i = 0; i < addressPoints.length; i++) {
    var a = addressPoints[i];
    var title = a[2];
    var marker = L.marker(new L.LatLng(a[0], a[1]), {
      icon: L.mapbox.marker.icon({'marker-size': 'small', 'marker-color': 'e8168c'}),
      title: title
    });
    marker.bindPopup(title);
    markers.addLayer(marker);
  }

  map.addLayer(markers);

});

- Erica

---

为什么不直接写一个循环来帮你完成这项工作呢？ - L. Sanna

我的JS技能不是很好。 - Erica

最终我把我的数据转换为 CSV 格式并找到了一个解析器。 - Erica

你认为从本地文件中获取csv文件是否可能？例如 var url = 'file://c:/output.csv' ? - Nefariis

Answer 1

创建一个geoJson图层，然后将该图层添加到MarkerCluster：

 var markers = new L.MarkerClusterGroup();
 var geoJsonFeature =  = {
  "type": "Feature",
  "properties": {
    "name": "Coors Field",
    "amenity": "Baseball Stadium",
    "popupContent": "This is where the Rockies play!"
  },
  "geometry": {
    "type": "Point",
    "coordinates": [-104.99404, 39.75621]
  }
 };
 var geoJsonLayer = L.geoJson(geoJsonFeature);

 markers.addLayer(geoJsonLayer);
 map.addLayer(markers);

- Sr.PEDRO

---

“dataFromMapbox”是什么，它长什么样？ - parkr

dataFromMapbox 是 GeoJSON 本身，如果不清楚的话抱歉，我复制了自己代码的片段。我编辑了代码以使其更易读。 - Sr.PEDRO

Answer 2

var geojson = dataFromMapbox;
var lat;
var lng;
for(var i= 0;i<geojson.features.length;i++)
  {
    lat = geojson.features[i].geometry.coordinates[0];
    lng = geojson.features[i].geometry.coordinates[1];

    //create a marker with those values, pass it to a MarkerCluster object

  }

- L. Sanna

---

这很聪明。我最终将我的数据转换为CSV，但这看起来可以做我尝试过的相同的事情。 - Erica