传单中的等值线 ajax

Question

我按照这里的教程 http://leafletjs.com/examples/choropleth.html 使用 GEOJSON 格式的州制作州级等值线。

Leaflet GeoJSON 允许我们发送 AJAX 获取外部参数的请求。像这样

$.ajax({
    dataType: 'json',
    url: 'atl_metro.geojson',
    success: function(data) {
        $(data.features).each(function(key, data) {

            var zips = L.geoJson(data,{
                onEachFeature: onEachFeature, 
                style: style
            }).addTo(map);  

        });
    }
}).error(function() {});

有没有办法使用 TopJSON 来使用它？

Answer 1

为什么不使用普通的 TopoJSON 并扔掉杂食插件。它只是一个包装器和另一个您不需要的依赖项，因为 TopoJSON 本身非常易于使用。

var url = 'https://rawgit.com/mbostock/topojson/master/examples/us-10m.json';

// Fetch topojson file via jQuery
$.getJSON(url, function(data) {
  // Convert the topojson to geojson 
  var geojsonData = topojson.feature(data, data.objects.counties);
  // Create new geojsonlayer with the data
  var geojsonLayer = new L.GeoJSON(geojsonData, {
    style: getStyle,
  }).addTo(map);
});

function getStyle(feature) {
  return {
    weight: 1,
    opacity: 1,
    color: '#fff',
    fillOpacity: 0.7,
    // fillColor: getColor(feature.properties.density)
    // TopoJSON used in this example doesn't have any data attributes
    // so throwing in some random colors
    fillColor: '#'+Math.floor(Math.random()*16777215).toString(16)
  };
}

这是一个关于 Plunker 的工作示例：http://plnkr.co/edit/5Kn94H?p=preview

传单中的等值线 ajax

Choropleth in Leaflet ajax

geojson

leaflet

topojson