Question

我正在尝试为我的y轴创建一个标签，我在显示它时遇到了问题。

SVG.append("g")
    .attr("class", "y axis")
    .call(yAxis)
    .append("text")
      .attr("class", "label")
      .attr("transform", "rotate(-90)")
      .attr("x", 100)
      .attr("y", 100)
      .style("text-anchor", "end")
      .text("Sepal Width (cm)");

当我使用上面的代码时，我无法显示我的标签，但是当我删除

时

      .attr("transform", "rotate(-90)")

我可以看到我的文字。

为什么会这样？

Answer 1

这是因为rotate相对于原点旋转文本，因此您的文本不在画布中。你有两个选择：

使用translate在旋转之前定位文本

.attr("transform", "translate(100, 100) rotate(-90)")

或者将可选的x和y参数添加到rotate（）

.attr("transform", "rotate(-90 100 100)")

为什么轴上的标签文字在D3.js中消失了？

1 个答案: