如何使用Fabric.js在画布上拉伸文本？

Question

我想拉伸画布Text对象的字体。我怎么能这样做？

示例（之前）：

示例（之后）：

我怎么能实现这个？

Answer 1

您可以使用scaleX通过缩放文本来“挤压”文本：

// "squish" the text to 60% of its original width
scaleX:0.60  

示例代码和演示

var canvas = new fabric.Canvas('canvas');

var myText = new fabric.Text('NEW TEXT',{
    left: 50,
    top: 60,    
});
canvas.add(myText);

var mySquishedText = new fabric.Text('NEW TEXT',{
    left: 50,
    top: 100,
    scaleX:0.60,  
});
canvas.add(mySquishedText);

body{ background-color: ivory; }
#canvas{border:1px solid red; margin:0 auto; }

<script src="http://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.5.0/fabric.min.js"></script>
<canvas id="canvas" width=300 height=300></canvas>

[更新：@AndreaBogazzi补充说scaleX处理比矩阵操作更好