Kineticjs通过CSS宽度和高度按比例缩放画布。 鼠标事件破坏发生

Question

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

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

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

Answer 1

通过修补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我的画布已缩放