Closed canbaoSama closed 3 months ago
用Group包裹可实现内部元素保持同比例变化,如果是Box / Frame的内部元素跟随缩放,可以看一下这篇文章:
https://leaferjs.com/ui/reference/property/resize.html#box-frame-%E5%85%83%E7%B4%A0
app = new App({ view: leaferViewRef.value, type: 'draw', // 禁止无限画布 editor: { rotateable: false, }, }) // 禁用旋转
group = new Group({ children: [ { tag: 'Rect', width: 200, height: 200, fill: '#32cd79', draggable: true, }, { tag: 'Ellipse', x: 50, y: 50, width: 100, height: 100, innerRadius: 0.5, fill: 'white', }, ], }) app.tree.add(group)
后面根据放大缩小的值更新长宽 group.width = imgData.width group.height = imgData.height
这种方式不能跟随放大缩小哎
用resizeWidth() / resizeHeight(), group直接设置不了width/height,需要调整子元素才能变化
比如我有一张图片打底,canvas和图片大小是保持一致的,那么在图片旋转、放大、缩小时,在图片上绘制的标注元素能够跟随图片进行旋转、放大和缩小呢