0

我一直在使用这个例子:http ://mbostock.github.io/d3/talk/20111018/azimuthal.html我让它显示并很好地处理我自己的数据。我看到在这个例子中他给每个国家一个标题

feature.append("svg:title")
  .text(function(d) { return d.properties.name; });

效果很好。我想实际放置文本而不是标题。所以我希望它作为一个标签出现在国家之巅。

我试过这个

feature.append("svg:text")
    .text(function(d) { return d.p.n; })
    .style("color", "#00FF33");

还有许多其他组合,但似乎没有出现。有趣的是,我可以使用 Chrome 检查器,我会正确地看到<text style="color: rgb(0, 255, 51);">Dominica</text>路径元素的内部,但我没有看到它出现在地图上。因此,显然它在技术上是有效的,因为它用正确的文本绘制它,但我没有看到任何显示。

例如,如果我这样做,我也可以轻松地渲染文本

svg.selectAll("text")
    .data(collection.features)
    .enter()
    .append("svg:text")
    .text(function(d){
        return d.p.n;
    })
    .attr("x", function(d){
        return path.centroid(d)[0];
    })
    .attr("y", function(d){
        return  path.centroid(d)[1];
    })
    .attr("text-anchor","middle")
    .attr('font-size','6pt');

但这只是将它们绘制到地图上,而不考虑现有国家,因此它们不会继续前进。

有任何想法吗?

谢谢

4

0 回答 0