当我用鼠标缩放时，附加以下功能myZoom将被执行：

myZoom.on('zoom', function() {

    someElement.attr('transform', 'translate(' + d3.event.translate[0] + ',' + d3.event.translate[1] + ') scale(' + d3.event.scale + ')');

....
// redraw axes, which should stay where they are at.
....

}

要在没有鼠标或其他定点设备的情况下模拟缩放，我只需更改上面属性“transform”的值即可。简单的。

但问题是在这个函数中我实际上重绘了轴，其比例会自动重新计算。参考d3的这个官方文档：

缩放.y([y])

指定 y 尺度，其域应自动调整 缩放时。如果未指定，则返回当前 y 比例，即 默认为空。如果以编程方式修改比例域， 它应该被重新分配给缩放行为。

我需要以编程方式缩放（也许使用缩放按钮）。如何触发缩放事件，以便自动重新计算轴的比例？

在 D3 库中，编程缩放似乎是一项艰巨的任务，因为 D3 缩放与鼠标事件密切相关。编程缩放的一个常见实例是使用滑块控件进行放大或缩小。令人惊讶的是，我找不到一个关于如何使用滑块控件进行 D3 缩放的工作示例。经过投入一些时间和精力，我开发了这个工作演示，可以在这里找到D3滑块缩放 http://www.computing.dcu.ie/~dganguly/d3sliderzoom.htm。关键点是使用滑块抛出的比例值来更改嵌入“

function zoomWithSlider(scale) {
    var svg = d3.select("body").select("svg");
    var container = svg.select("g");
    var h = svg.attr("height"), w = svg.attr("width");

    // Note: works only on the <g> element and not on the <svg> element
    // which is a common mistake
    container.attr("transform",
            "translate(" + w/2 + ", " + h/2 + ") " +
            "scale(" + scale + ") " +
            "translate(" + (-w/2) + ", " + (-h/2) + ")");

}

然后必须从滑块的更改事件调用此方法，如下所示。

$(function() {
$( "#slider-vertical" ).slider({
    orientation: "vertical",
    range: "min",
    min: 1000,
    max: 10000,
    value: 1000,
    slide: function( event, ui ) {
        zoomWithSlider(ui.value/1000);
    }
});

});

这个解决方案比生成伪鼠标滚动事件要优雅得多。