时间戳

首页 > 解决方案 > Fabric.js：画布右半部分的文本位置（水平中心）

fabricjs - Fabric.js：画布右半部分的文本位置（水平中心）

问题描述

“centerH()”将文本定位在整个画布大小的水平中心。我想将我的文本居中在右半部分（好像左边画布的 50% 被裁剪了）。我可以实现一个while循环，它总是检查左右的距离，直到它相等，但也许有更简单的方法来做到这一点？

标签： fabricjs

解决方案

您可以将文本的左侧设置为画布宽度的一半。

text.set({
  left:canvas.width/2
});


var canvas = new fabric.Canvas('canvas');
var text = new fabric.Text('FabricJS',{
 left:10,top:20
});
canvas.add(text);
function setToCenter(){
 text.set({
  left:canvas.width/2
 });
 text.setCoords();
 canvas.requestRenderAll();
}
canvas {
  border: 1px solid #999;
}
<script src="https://rawgit.com/kangax/fabric.js/master/dist/fabric.js"></script>
<button onclick='setToCenter()'>Center</button>
<canvas id="canvas" width="400" height="400"></canvas>

推荐阅读