使用Fabric JS倾斜左右画布文本对象

Question

如何使用Fabric JS使画布文本对象向右倾斜和向左倾斜？ 屏幕截图。

为了偏右

向左倾斜

非常感谢任何帮助。

Answer 1

根据所使用的Fabric js版本，开箱即用可能具有偏斜支持：（1.6.0-rc +）

 var canvas = new fabric.Canvas('canvas'); var textLeft = new fabric.Text('13-arid-365',{ left:100, top: 25, skewX: 45 }); canvas.add(textLeft); var textRight = new fabric.Text('13-arid-365',{ left: 100, top: 75, skewX: -45 }); canvas.add(textRight); 

 <script src='http://www.deltalink.it/andreab/fabric/fabric.js'></script> <canvas id="canvas" width=300 height=300></canvas> 

transformMatrix和skew功能之间的区别在于，可以更好地支持倾斜，并且可以使用一致的边界框，而不能使用变换矩阵。