我一直在搞弄D3JS源代码。我要实现的是,如果也按了CTRL,则仅允许使用“滚动”(就像Google Maps)进行缩放。我一直在弄乱完整的D3:
https://d3js.org/d3.v4.js
我试图在16556行附近实现这一点:

  function wheeled() {
    if (!filter.apply(this, arguments)) return;
    if (event.ctrlKey == false) return;    //This is the new line I added
    .....
    //else if ((t.k === k)) return;        //I commented out this line
其他一切都完好无损。我下载了此文件,并经历了以下示例:
https://bl.ocks.org/mbostock/34f08d5e11952a80609169b7917d4172
在Chrome浏览器中,它运行良好。一切都按预期进行,但是当我尝试在Firefox中按Ctrl + Scroll时,它只会放大整个页面。 Firefox说:
ReferenceError: event is not defined[Learn More] d3.v4.js:16558:1
    wheeled http://127.0.0.1:8887/d3.v4.js:16558:1
    contextListener/<

最佳答案

我偶然发现了相同的问题,但不想更改d3源文件。然后,我仅通过有条件地调用原始车轮处理程序(使用D3v4)解决了该问题:

this.zoom = d3.zoom()[...]

var svg = d3.select(this.$refs.chart)
             .call(this.zoom);

var wheeled = svg.on("wheel.zoom");

svg
    .on("wheel.zoom", function () {
        if (d3.event.ctrlKey) {
            wheeled.call(this);
            // prevent browser zooming at minimum zoom
            d3.event.preventDefault();
            d3.event.stopImmediatePropagation();
        }
    });

09-10 06:59
查看更多