javascript - Kineticjs通过CSS宽度和高度对 Canvas 进行比例缩放。鼠标事件破坏发生

我有一个带有d3过渡和缩放比例的svg。我想将其上的所有内容复制到启用了鼠标事件的画布上。为进行性能优化而做的一切都很好，除了当dynamicsjs画布的宽度和高度不是100％时，鼠标事件就会中断。

我发现更改画布CSS属性（例如位置，顶部，左侧）不会破坏鼠标事件，但是宽度和高度（而不是100％）会破坏鼠标事件。有没有一种方法可以说是dynamicjs，无需重新绘制就可以重新计算对象的坐标？

只是为了澄清一下：缩放时我不想重绘画布，否则根本不会有任何性能提升，因此setScale（）解决方案将无法工作

最佳答案

通过修补dynamicjs解决：

在9581行之后，我添加了：

    setStageScale: function(value) {
        this.stageScale = value;
    },

在方法_setPointerPosition中，我将最后一条语句更改为：

       if (x !== null && y !== null) {
            var canvasScale = this.stageScale || 1;
            this.pointerPos = {
                x: x / canvasScale,
                y: y / canvasScale
            };
        }

现在我只需要.setStageScale（scale）来通知dynamicjs我的画布已缩放