Fabric.js : How to set a custom size to Text or IText?

I am using the excellent Fabric.js to draw some text in a canvas. When I specify a custom size ( let’s say a 200×200 rectangle) to my IText Object, it seems that Farbric.js force the width and the height of the object to fit around the text.

var t = new fabric.IText("Hello world !", {
  top: 100,
  left: 100,
  width: 200,
  height:200,
  backgroundColor: '#FFFFFF',
  fill: '#000000',
  fontSize: 12,
  lockScalingX: true,
  lockScalingY: true,
  hasRotatingPoint: false,
  transparentCorners: false,
  cornerSize: 7
});

Here is a Fiddle with my problem : http://jsfiddle.net/K52jG/4/

In this example, I want the “Hello World!” text to be in a 200×200 box. Is it possible to do that, and how ?

77 thoughts on “Fabric.js : How to set a custom size to Text or IText?”