D3.js：使用鼠标滚轮滚动缩放 x 轴和数据

我搜索了其他相关问题，但无论是因为我是 D3 新手，还是作为一名编码员生疏，我无法弄清楚这一点。

我有一个图表，我希望能够通过仅在 a 轴和数据上滚动鼠标滚轮来放大。现在，我的整个图表在鼠标滚轮的滚动上进行缩放，而不是仅在 x 轴上进行缩放。

编辑：这是我的最终目标，但也许有放大/缩小限制（不过一次一件事）：http://mbostock.github.com/d3/talk/20111018/#15 http://mbostock.github.com/d3/talk/20111018/#15

看起来这里发布了该示例的代码：https://github.com/mbostock/d3/blob/master/examples/zoom-pan/zoom-pan-transform.html https://github.com/mbostock/d3/blob/master/examples/zoom-pan/zoom-pan-transform.html

graph.attr("transform", "translate(" + d3.event.translate + ")" + " scale(" + d3.event.scale + ")");

到目前为止我已经把我的代码放在这里：http://jsfiddle.net/toddsherman/x3uWK/ http://jsfiddle.net/toddsherman/x3uWK/

任何见解或方向表示赞赏。

部分答案，在源代码中作为参考给出的 jsfiddle 中，有：

chart.select(".xaxis").call(xAxis);
chart.select(".yaxis").call(yAxis);

这指的是您可能感兴趣的事情：

xAxis = d3.svg.axis().scale(x);
yAxis = d3.svg.axis().scale(y).orient("left");

x 和 y 似乎是缩放函数：

var x = d3.time.scale().domain([minDate, maxDate]).range([0, graph_width]);

var y = d3.scale.linear()
    .domain([0, max_val])
    .range([graph_height, 0]);

此外，缩放功能还有不同的转换：

chart.selectAll(".chart rect").attr("transform", "translate(" + d3.event.translate[0] + ",0)scale(" + d3.event.scale + ", 1)");

平移参数只是 X 轴和 Y 轴的 0 值。 比例参数仅包含 X 轴和 Y 轴 1 值。

也就是说，我不太确定如何提供更多帮助