AndroidStorm
AndroidStorm

Reputation: 161

Fabric.js: Text position at right half of canvas (horizontal center)

"centerH()" positions the text at the horizontal center of the complete canvas size. I want to center my text at the right half (as if 50% of the left canvas was cropped). I could implement a while loop which always checks the distance to the right and left until it is equal but maybe there is an easier way to do this?

Upvotes: 1

Views: 1607

Answers (1)

Durga
Durga

Reputation: 15604

You can set left of text as half of canvas width.

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>

Upvotes: 3

Related Questions