javascript - fabric.js 无法使文本与 textAlign 对齐

Question

我无法在 fabric.js 中使用 textAlign fontSize、fontBackground 可以正常工作，但 textAlign 不能。我错过了什么吗？

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

$('button.addText').click(function() {
  var text = new fabric.Text($(this).siblings().val(), {
    textAlign: 'center',
    fontSize: 40
  });
  canvas.add(text);
});

Answer 1

var canvas = new fabric.Canvas('myCanvas');
var align = ["left", "center", "right" , "justify"];
var el = document.getElementById('res');
var txt = 'FabricJS \n is \nAwsome';

var text = new fabric.Text(txt, {
    textAlign: 'left', //"left", "center", "right" or "justify".
    width:450,
    fontSize: 40
  });
canvas.add(text);
changeAlign();

function changeAlign(){
 var val = align[Math.floor(Math.random() * align.length)];
 text.set('textAlign',val);
 el.innerHTML = 'Text Alignment : ' +val;
 canvas.setActiveObject(text);
 canvas.renderAll();
}

canvas {
 border : 2px dotted blue;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.7.17/fabric.min.js"></script>
<canvas id="myCanvas" width="600" height="300"></canvas><br>
<button onclick='changeAlign()'>Change align</button><p id='res'></p>

@AndreaBogazzi 他是对的。在文本中，框取决于第一行的宽度，如果你愿意那么它适用于多行文本。检查片段。