javascript - 缩放时如何更新轴上的刻度值？

Question

我有这个 fiddle :

http://jsfiddle.net/q0ubpmwj/3/

它有一个 x 轴和 y 轴以及一个矩形，您可以使用鼠标在屏幕上移动和放大该矩形。

这些轴用作标尺，用于测量屏幕上显示的内容。我找到了这个例子:http://bl.ocks.org/mbostock/3892928

我想要类似的但没有平底锅。因此，当我放大矩形时，我希望刻度值根据缩放进行缩放。但我不确定如何将其合并到我的代码中。

我尝试将轴的代码放入函数中并将比例传递给它，以便在重绘函数中再次调用它，但似乎无法正常工作。

function updateAxis(scale){ //creates the axis

    x = d3.scale.linear()
    .range([0, width*scale]);

    y = d3.scale.linear()
        .range([0, height*scale]);
.
.
.
.
.

Answer 1

我想我已经解决了。我将其添加到重绘中。

 svg.select(".x.axis").call(xAxis);
  svg.select(".y.axis").call(yAxis);

看起来我在那里有我需要的东西，只是根本没有更新它:L

更新了 fiddle :http://jsfiddle.net/q0ubpmwj/4/