2

我正在使用 Leaflet 作为基础层和 d3 topojson 文件制作延时填充地图,以便我可以在某些国家/地区着色。我使用http://bost.ocks.org/mike/leaflet/开始,一切都很顺利,直到我尝试在俄罗斯联邦遮阴。它的陆地跨越不连续的瓷砖,当我尝试向我的#RUS 路径添加填充样式时,它的行为异常。示例在这里:http ://dataviz.du.edu/projects/scratch/study_abroad.html 示例将需要 1.5 秒才能完全渲染,它为 3 个国家着色,最后是俄罗斯联邦着色。

此示例使用我在其他纯 d3 项目中使用过的 topojson 文件,并且在这些上下文中填充了#RUS,而没有此问题。

任何人都可以帮忙吗?提前致谢。

4

1 回答 1

1

此示例使用我在其他纯 d3 项目中使用过的 topojson 文件,并且在这些上下文中填充了#RUS,而没有此问题。

您一定是误会了,因为您的 TopoJSON 文件实际上已损坏。直接从您的服务器查看该文件的示例:http ://plnkr.co/edit/QOTwV3?p=preview 请注意,我使用的是普通的 TopoJSON 和 Leaflet 的 GeoJSON 层,但它产生的结果完全相同。

PS。您为什么要为此使用 D3 有什么理由吗?问是因为我看到你在做什么可以只使用 Leaflet 和 TopoJSON 来完成,而不需要 D3。这是一个简单的例子:

function delay(features) {
  var geojsonLayer = new L.GeoJSON(null, {
    style: getStyle,
  }).addTo(map);
  var delay = 100;
  features.forEach(function(feature) {
    delay = delay + 100;
    setTimeout(function() {
      geojsonLayer.addData(feature);
    }, delay);
  });
}

var url = 'http://crossorigin.me/http://dataviz.du.edu/projects/scratch/worldnew.json';

$.getJSON(url, function(data) {
  var geojsonData = topojson.feature(data, data.objects.test);
  delay(geojsonData.features);
});
于 2015-09-15T11:38:55.617 回答