d3 在 Firefox 中縮放 NaN

Question

我有一個使用 d3 zoom 的應用程序，它可以在 Chrome 中運行，但在 Firefox 中不能（對我來說）。 我將縮放問題歸結為以下非常簡單的示例：

https://codesandbox.io/s/d3-zoom-error-in-firefox-mzid3

import { zoom } from "d3-zoom";
import { select } from "d3";

select("svg").call(
  zoom().on("zoom", (event) => {
    console.log(`Transform: ${event.transform.toString()}`);

    select("g").attr("transform", event.transform.toString());
  })
);

在代碼沙盒的默認拆分視圖中，灰色方塊上的輪子縮放對我有用，但是當我在新選項卡中打開瀏覽器預覽並嘗試它時，控制台會記錄“translate(NaN,NaN) scale(NaN)”的轉換值”。 我確定我遺漏了一些明顯的東西。

Answer 1

原來這是由我安裝的擴展引起的： https://addons.mozilla.org/en-US/firefox/addon/logitechsmoothscrolling/ 。 Georgy 指出該演示對他們有用，這讓我更仔細地查看了我的特定 Firefox 配置文件。 由於該擴展程序已有 4 年的歷史，並且沒有它滾動看起來非常流暢，因此我對刪除擴展程序感到滿意。