Javascript X轴文本标签在d3中不旋转

我正在使用D3堆栈条形图

小提琴是

当我单击“月份”按钮时，图表显示为一个凌乱的x轴标签

我想有条件地旋转x轴标签，以防有大量数据（在小提琴中，用于数月数据）

我的第一步是旋转标签。我在后面加上一部分

  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", "rotate(-65)" );

---

我不确定，为什么它不起作用。这里有什么问题？

您的代码没有问题-请参阅以下内容：

var margin={top:25，right:25，bottom:25，left:25}
变量宽度=600-margin.left-margin.right；
变量高度=200-margin.top-margin.bottom；
//x域
var x=d3.时间日（新日期（2020,00,01），新日期（2025,11,01））；
//x刻度
var xScale=d3.scaleTime（）
.域（d3.范围（x））
.范围（[0，宽度]）；
//svg
var svg=d3。选择（“缩放”）
.append（“svg”）
.attr（“宽度”，宽度+边距。左侧+边距。右侧）
.attr（“高度”，高度+边距。顶部+边距。底部）
.附加（“g”）
.attr（“transform”，`translate（${margin.left}，${margin.top}）`）；
//凌乱的x轴
svg.append（“g”）
.attr（“类”、“x轴”）
.attr（“transform”，`translate（0，${height-50}）`）
.call（d3.axisBottom（xScale）
.滴答声（d3.时间月）
);
//带有旋转标签的x轴
svg.append（“g”）
.attr（“类”、“x轴”）
.attr（“transform”，`translate（0,0）`）
.call（d3.axisBottom（xScale）
.滴答声（d3.时间月）
)
.selectAll（“text”）//您的代码
.style（“文本锚定”、“结束”）//您的代码
.attr（“dx”，“-.8em”）//您的代码
.attr（“dy”，“.15em”）//您的代码
.attr（“变换”、“旋转（-65）”）；//你的代码