d3/topojson无法获取路径元素的质心

我有一个美国JSON文件，用于生成地图。路径生成状态很好，但现在我想在每个路径/状态的中心添加状态名称。d3/topojson无法获取路径元素的质心

这里的

var usa = {"type": "FeatureCollection", 
"features": [{ "type": "Feature", "properties": { "NAME": "Alabama"}, "geometry": { "type": "MultiPolygon", "coordinates": [ [ [ [ -88.124658, 30.283640 ]...

我已经追加到我已经创建

var allStates = svg.selectAll("path") 
    .data(usa.features) 
    .enter() 
    .append("path") 
    .attr("d", path)

的SVG创建国家JSON文件的一个例子，这里是我想添加国家名称作为文本

var allStatesNames = svg.selectAll('text') 
    .data(usa.features) 
    .enter().append("svg:text") 
    .attr("transform", function(d) { 
    return "translate(" + path.centroid(d.geometry.coordinates) + ")"; }) 
    .text(function(d) {return d.properties.NAME})

但我只是不断收到这回

<text transform="translate(NaN,NaN)">Virginia</text>

为什么我会得到NaN而我应该使用什么呢？

在此先感谢您的帮助！

来源

2014-03-14 Addison

所以问题是，path.centroid既需要形状的类型以及坐标，所以你不能只传递坐标。实际上你可以用d来传递整个特征。

尝试将path.centroid（d）放入变换attr的返回中，它应该适合您。看来，path.centroid（d.geometry）也适用，但不太正确。

来源

2014-03-14 05:14:22 lyyons

'path.centroid（）'实际上需要一个特性，所以你需要做'path.centroid（d）'。 –

所以它确实 - 看起来他们都工作。感谢您的提醒！ – lyyons

d3/topojson无法获取路径元素的质心

回答

相关问题