如何使用D3获取来自GeoJSON数据集的投影路径定义字符串（不是SVG元素）？

有很多使用D3路径投影工具从D3地理数据中绘制SVG路径的示例。例如，here's one I wrote earlier (D3 v3)，这里是一个recent example using D3 v4。如何使用D3获取来自GeoJSON数据集的投影路径定义字符串（不是SVG元素）？

他们都看起来像这样：

svg.append("path") 
     .data(topojson.feature(datafile, datafile.objects.featureOfInterest)) 
     .attr("class", "land") 
     .attr("d", pathDefinitionObject);

...其中数据文件被读出，并与一些SVG关联，创建链接的空路径，然后用一定的投影长相关联的D3路径定义对象数据并使用它将SVG路径定义字符串添加到这些路径的d属性中。

我想要的是，那些路径定义字符串，但作为字符串，而不触及任何SVG。我想和Raphael一起使用这些字符串，以便我可以在不支持SVG的浏览器上绘制路径，因为某个特定项目需要支持机构客户，因为遗留软件要求和公司策略尚未从IE8升级（我知道，我知道...）。

D3显然能够定义这些字符串，但我看不到明显的方式让路径定义对象输出字符串而不链接到DOM SVG元素。

如何获得字符串，页面上没有任何SVG？

我试图使用一组D3 v4's "microlibraries"这个最小的，所以奖励积分以最少D3依赖（答案尤其是如果它能够避免D3-selection.js这是相当大的 - 我的理想'只想使用D3的数据处理，并且完全不使用它的DOM操作来完成这个项目）。

来源

2016-07-27 user568458

建立了你的链接v4例如极简代码只拿到土地路径d属性是：

<!DOCTYPE html> 
<meta charset="utf-8"> 

<script src="//d3js.org/d3-array.v1.min.js"></script> 
<script src="//d3js.org/d3-geo.v1.min.js"></script> 
<script src="//d3js.org/d3-request.v1.min.js"></script> 
<script src="//d3js.org/d3-dispatch.v1.min.js"></script> 
<script src="//d3js.org/d3-collection.v1.min.js"></script> 
<script src="//d3js.org/topojson.v1.min.js"></script> 

<script> 

var projection = d3.geoAlbers() 
    .scale(1280) 
    .translate([500, 500]); 

var path = d3.geoPath() 
    .projection(projection) 
    .pointRadius(1.5); 

d3.json("https://gist.githubusercontent.com/mbostock/4090846/raw/d534aba169207548a8a3d670c9c2cc719ff05c47/us.json", function(error, us){ 
    if (error) throw error; 

    var topo = topojson.feature(us, us.objects.land); 
    console.log(path(topo)); 

}); 

</script>

如果你不使用d3.json，你可以删除d3-request，d3-dispatch和d3-collection库。

来源

2016-07-27 13:31:31 Mark

太棒了！不能相信我所要做的就是将geojson对象传递给路径对象！这会将featureCollection中每个要素的一个兆字符串组合成一个“M ... ZM ... ZM ... Z”复合字符串，但只需在'topo.features'周围运行'for'循环就很容易了。把它们分开 – user568458

如何使用D3获取来自GeoJSON数据集的投影路径定义字符串（不是SVG元素）？

回答

相关问题