我有一个简单的 KonvaJS 图像缩放/平移示例,现在我在鼠标单击时添加 anchor ,但问题是当舞台缩放缩放时 anchor 也会变大。我想防止 anchor 在舞台缩放时缩放。
理想情况下,我会寻找某种方式在舞台缩放时进行聆听并减小 anchor 的大小,以便它们保持相同的大小而不会对整个规模使用react。
这是我已经完成的示例:
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();
});
最佳答案
每次缩放舞台时,您只需调整所有 anchor 的大小即可。你可以这样做:
stage.find('Circle').setAttrs({
scaleX: 1 / stage.scaleX(),
scaleY: 1 / stage.scaleY()
});
关于javascript - KonvaJS:缩放整个舞台时如何防止某些形状缩放?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54726049/