Skip to content
Advertisement

FabricJS: Vertical Align text center

I am using fabricjs 1.5 and I am stuck on aligning the text in the middle of the line vertically. I am using this code to set the line height

text.setProperty('lineHeight', $scope.lineHeight.current);

It changes the line height of text on canvas but text always remains at the top. I want it to be in the vertically middle. Please help.

Advertisement

Answer

You need to use newer versions of fabricjs. 1.5 is too old. For alignment use fabric.Textbox textAlign property.

DEMO

var canvas = new fabric.Canvas("canvas");
canvas.add(new fabric.Textbox('FabricJS is Awsome',{width:300,textAlign:'center'}));
canvas{
 border: 1px solid #000;
}
<script src="https://rawgit.com/kangax/fabric.js/master/dist/fabric.js"></script>
<canvas id="canvas" width=400 height=400></canvas>
User contributions licensed under: CC BY-SA
9 People found this is helpful
Advertisement