Javascript 折线图缩放D3 V4上的文本转换和日期时间格式问题

我正在尝试使用以下代码旋转x轴文本：

      focus.append("g")
          .attr("class", "axis axis--x")
          .attr("transform", "translate(0," + height + ")")
          .call(xAxis)
          .selectAll("text")
          .attr("class", "x-axistext")
          .style("text-anchor", "end")
          .attr("dx", "-.8em")
          .attr("dy", ".15em")
          .attr("font-family", textfontfamily) 
          .attr("font-weight",textfontweight)
          .attr("font-size", textfontsize)
          .attr("transform", function (d) {
            return "rotate(-65)"
        }); 

文本正在旋转，但仅当图形未缩放时。在缩放图形时，文本不旋转。一旦开始缩放图形，新文本将不会处于旋转位置

我面临的下一个问题与日期时间格式有关。下面是我用来格式化文本的代码行

var parseDate = d3.timeParse("%H:%M:%S");

但它也不能正常工作。时间与“上午”“下午”一起显示

---

：这是问题1的完整代码

时间与“上午”“下午”一起显示

如果您希望刻度上的时间采用某种格式，请提供时间格式：

xAxis=d3.axisBottom（x）.tickFormat（d3.timeFormat（“%H:%M:%S”））

问题2

在缩放图形时，文本不旋转

在缩放/画笔上，需要选择所有标记并进行旋转

      focus.selectAll(".axis--x")
          .selectAll("text")
          .attr("class", "x-axistext")
          .style("text-anchor", "end")
          .attr("dx", "-.8em")
          .attr("dy", ".15em")
          .attr("font-family", textfontfamily) 
          .attr("font-weight",textfontweight)
          .attr("font-size", textfontsize)
          .attr("transform", function (d) {
            return "rotate(-65)"
        });         

---

工作代码

谢谢Cyril，您的解决方案运行良好。。。这是唯一的办法。。