KonvaJS：缩放整个舞台时如何防止某些形状缩放？答案

【问题标题】：KonvaJS: How to prevent some shapes from scaling when scaling whole stage?KonvaJS：缩放整个舞台时如何防止某些形状缩放？
【发布时间】：2019-02-16 17:58:10
【问题描述】：

我有一个简单的 KonvaJS 图像缩放/平移示例，现在我在鼠标单击时添加锚点，但问题是当缩放舞台以进行缩放时，锚点也会变大。我想在舞台缩放时防止锚点缩放。

理想情况下，我会寻找某种方式在舞台缩放时聆听并减小锚点的大小，以便它们保持相同的大小而不会在整个比例上做出反应。

这是我已经做过的一个例子：

stage.on('click', (e) => {
        const transform = layer.getAbsoluteTransform().copy();
        transform.invert();
        const pos = stage.getPointerPosition();
        const anchorPos = transform.point(pos);
        const anchor = new Konva.Circle({
            x: anchorPos.x,
            y: anchorPos.y,
            radius: 20,
            stroke: '#666',
            fill: '#ddd',
            strokeWidth: 2,
            draggable: true
        });

        layer.add(anchor);
        layer.draw();
    });

https://codepen.io/aurimasniekis/pen/yZQjrN

【问题讨论】：

标签： javascript konvajs

【解决方案1】：

每次缩放舞台时，您只需调整所有锚点的大小。你可以这样做：

stage.find('Circle').setAttrs({
  scaleX: 1 / stage.scaleX(),
  scaleY: 1 / stage.scaleY()
});

https://codepen.io/lavrton/pen/pGQQqZ

【讨论】：

后来我想出了类似的解决方案 :) 但是感谢您的帮助