有一个fabricjs的group,它的成员包括一个rect和text,当这个group在画布上拉伸之后,有了自己的scaleX和scaleY值,如何修改成员text的left\和top值让文字始终在group的左上角
时间: 2023-06-15 13:03:15 浏览: 40
可以通过计算group的缩放比例和成员text的left和top值来实现。
首先,获取group的scaleX和scaleY值:
```javascript
var group = // 获取group对象
var scaleX = group.scaleX;
var scaleY = group.scaleY;
```
接着,获取成员text的left和top值:
```javascript
var text = group.item(1); // 假设text是group的第二个成员
var textLeft = text.left;
var textTop = text.top;
```
然后,计算text相对于group左上角的偏移量:
```javascript
var offsetX = textLeft - group.left;
var offsetY = textTop - group.top;
```
最后,根据group的缩放比例和偏移量,计算出text在group缩放后应该在的位置:
```javascript
var newTextLeft = group.left - group.width / 2 * scaleX + offsetX * scaleX;
var newTextTop = group.top - group.height / 2 * scaleY + offsetY * scaleY;
```
将计算出的newTextLeft和newTextTop赋值给text的left和top属性即可:
```javascript
text.set({ left: newTextLeft, top: newTextTop });
canvas.renderAll(); // 渲染画布
```