Fabric.js setCoords()

Fabric.js 中一些操作需调用setCoords()才能重新计算控制位置(改变Object状态)

哪些操作后需要调用setCoords()

object.set('left', 123)
object.setTop(456)
object.set('width', 100)
object.set('height', 100)
object.set('scaleX', 1.5)
object.set('scaleY', 1.5)
object.set('skewX', 20)
object.set('skewY', 20)
object.set('padding', 10)
object.set('angle', 45)
object.set('strokeWidth', 12)
object.center() 
object.centerH()
object.centerV()
canvas.zoomToPoint(...)

怎样调用

object.setCoords()

Fabric.js 移动物体的方法

• Fabric.js 中的Rect、Polygon、Path类别，如果想要发生位置更新的话，需要设置其left和top属性，然后调用setCoords()，重新计算各个类别的边界点坐标，这样就可以更新Object的位置了。
• Polygon和Path两个类别均包含记录边界点的属性，Polygon对象的points属性记录多边形所有的拐点，Path对象的path属性记录path路径的所有点。当更新Polygon和Path对象位置时，其points属性或者path属性并不会发生变化，因此如果想通过更改points属性或者path属性来更改Object的位置的思路是行不通的。
• Fabric.js 绘制Object的顺序应该是: 如果是Polygon和Path对象，先根据其points属性或者path属性生成对应的Object，然后根据oCoords生成包围Object的矩形框，然后根据left、top值将其移动到指定的位置上。

参考文档: 官方说明