使用d3.js缩放条形图

我试图创建一个带有时间刻度的条形图，可以放大到任何时间段。我能够为我的x轴（时间刻度）创建缩放功能，但是我的数据（在本例中为RECT）不会随轴缩放

以下是我的图表的简化版本： 如您所见，我可以放大到x轴，但条形图不能沿x轴缩放

这里是jfiddle链接：

}

---

我觉得我应该增加更多的功能，我的缩放功能的功能是有效的酒吧（矩形）。我真的很感激任何帮助。

我也在想同样的事情，所以至少知道你有好朋友。这是我目前的做法。首先，我无法从您的代码生成绘图，而且链接也不会向我发送任何有用的内容——没有图表呈现。所以我不能帮你解决具体问题。但是，这里有一个具有可缩放矩形的示例：。我现在正在检查它，删除不必要的元素，看看是否可以让它工作。希望这有帮助

使用“selectAll”，我分别对每个条应用了缩放和平移，仅将缩放和平移限制在x轴上

function zoom() {
    chart.select(".xaxis").call(xAxis);
    chart.select(".yaxis").call(yAxis);
    chart.selectAll(".chart rect").attr("transform", "translate(" + d3.event.translate[0] + ",0)scale(" + d3.event.scale + ", 1)");
}

---

这同样适用于单个路径元素，当我偶然发现您的问题时，我正试图弄清楚这一点。

链接似乎已断开。

function zoom() {
    chart.select(".xaxis").call(xAxis);
    chart.select(".yaxis").call(yAxis);
    chart.selectAll(".chart rect").attr("transform", "translate(" + d3.event.translate[0] + ",0)scale(" + d3.event.scale + ", 1)");
}