Question

我无法将transformMatrix应用于Fabric中的Text对象。

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

canvas.add(new fabric.Text('Transform does not work', {
    fontSize:20,
    left:0,
    top:0,
    'transformMatrix': [1,0,0,1,0,200] // should translate by 200px down. But this does not work
}));


canvas.add(new fabric.Text('But this works', {
    fontSize:20,
    left:0,
    top:200
}));

// transform works on other objects:
canvas.add(new fabric.Rect({
    left:0,
    top:0,
    width:50,
    height:50,
    fill:'red',
    'transformMatrix': [1,0,0,1,100,100]
}));

还有其他人看过这个问题吗？我知道我可以通过改变位置进行翻译，但我需要能够为我的应用程序使用变换矩阵。

Answer 1

transformMatrix for text在最新版本的fabric.js即可正常工作。 1.4.1 https://github.com/kangax/fabric.js/blob/master/CHANGELOG.md

检查以上链接。

Answer 2

canvas.add(new fabric.Rect({
    left:100,
    top:100,
    width:50,
    height:50,
    fill:'red',
    'transformMatrix': [1,0,0,1,0,0]
}));

尝试给出顶部和左侧而不是在变换矩阵中给出它

Answer 3

如果你想旋转项目，你可以简单地使用

const text = new fabric.Text('Text label', { angle: 90 })
OR
text.angle = 90;

Fabric.js文本转换不起作用

3 个答案: