svg - 如何使用 d3 正确旋转文本

Question

我在这里为我的问题做了一个 jsfiddle：http: //jsfiddle.net/75tuw/1/。

g.append('text')
    .attr('x', function(d, i){ return x(i); })
    .attr('y', h + 10)
    .attr('transform','rotate(25)')
    .text(function(d){ return d.name; });

我遇到了一个问题，即图表中的所有文本都沿同一基线旋转，即使它们每个都有单独的 x 和 y 值。我究竟做错了什么？

谢谢！-埃文

Answer 1

这是工作小提琴：

.attr('transform',function(d,i){
      return 'translate('+x(i)+','+(h+10)+')rotate(25)';})