旋转条形图中的文本

Question

我正在尝试做一个垂直条形图，其中每个条形图中都有相应的值（它们是巨大的数字）。所以我想将每个文本旋转-90度，以便它们在条形中对齐。问题是，我无法为每个文本设置不同的原点，以便我可以独立旋转它们。所有文本元素都有一个共同的起源和旋转就像它们保持在线一样，如图所示。为每个文本生成不同的起源？ enter image description here

Answer 1

您可以执行以下代码之类的操作。看看this example。在plnkr上发布你的代码，如果这对你不起作用，我可以看看。

 svg.append("g")
 .attr("class", "x axis")
 .attr("transform", "translate(0," + height + ")")
 .call(xAxis)
 .selectAll("text") 
 .style("text-anchor", "end")
 .attr("dx", "-.8em")
 .attr("dy", ".15em")
 .attr("transform", function(d) {
  return "rotate(-65)" 
  });