Javascript d3从左侧而不是从中心缩放

我们正在使用d3构建一个图形，它有两个自定义按钮来处理缩放以及通过鼠标滚轮/轨迹板进行的标准缩放

let local = this;

let zoomIn = d3.select("#zoom_in");
let zoomOut = d3.select("#zoom_out");
let reset = d3.select("#reset");

zoomIn.on("click", function() {
  zoom.scaleBy(local.chart.transition().duration(500), 1.2);
});

zoomOut.on("click", function() {
  zoom.scaleBy(local.chart.transition().duration(500), 0.8)
});

这将精细缩放图形（包括笔刷）。然而，它从中心放大

根据文件：从中心缩放是默认行为，除非提供位置。。。但是我们还没有弄清楚这个参数到底应该是什么

我们已尝试：

zoom.scaleBy(local.chart.transition().duration(500), 0.8, 0);

并尝试使用translateBy:在缩放后将其移回左侧：

zoom.scaleBy(local.chart.transition().duration(500), 0.8, 0);
zoom.translateBy(local.chart.transition().duration(500), 0, 0);

但这抵消了变焦

是否有使用

scaleBy

从某个位置缩放的示例？

您介绍过的API文档（重点是我的）：

缩放比例（选择，k[，p]）
[…]
p点可以指定为两元素数组[px，py]或函数

通过提供两个元素的数组作为调用的第三个参数，可以指定缩放的中心。对于您的代码，可以按如下方式指定：

zoom.scaleBy(local.chart.transition().duration(500), 1.2, [0, height / 2]);
                                                       //  ↑  ↑
                                                       // [px,py        ]

类似地，这适用于

zoom.scaleTo（）

、

zoom.translateBy（）

和

zoom.translateTo（）