旋转放置在地图d3.js中的文本

Question

使用此功能，我可以为地图添加名称：Add names of the states to a map in d3.js

现在，我如何旋转这些文本，因为它们相互重叠。

Answer 1

对于那些正在寻找解决方案的人。

添加此解决了它。它产生组成矩阵。

.attr('transform', function(d) {
    return 'translate('+path.centroid(d)[0]+','+path.centroid(d)[1]+') rotate(-45);
})

以下是更新后的代码：

function draw(){

  d3.json("readme.json", function(json) {
    g.selectAll("path")
    .data(json.features)
    .enter()
    .append("path")
    .attr("d", path)
    .on("click", click);

    g.selectAll("text")
    .data(json.features)
    .enter()
    .append("svg:text")
    .text(function(d){
        return d.properties.name;
    })
    // .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')

    // added
    .attr('transform', function(d) {
        return 'translate('+path.centroid(d)[0]+','+path.centroid(d)[1]+') rotate(-45);
    })

  });
}