Skip to content

Instantly share code, notes, and snippets.

@michaelbukachi
Last active June 4, 2024 20:06
Show Gist options
  • Save michaelbukachi/65efa9ad5289000866bc4c18f391e746 to your computer and use it in GitHub Desktop.
Save michaelbukachi/65efa9ad5289000866bc4c18f391e746 to your computer and use it in GitHub Desktop.
Fabric.js Textbox resize according to specified height
// load canvas with id 'c'
const canvas = new fabric.Canvas('c');
// use canvas height as the height limit
var limit = canvas.height;
var text = new fabric.Textbox('Some very long text');
// set initial values
text.set({
top: margin,
width: canvas.width,
textAlign: 'center',
fontWeight: 'bold',
fontSize: 12
});
while (text.width > canvas.width) {
text.setWidth(text.width -= 10);
}
while (text.height > limit) {
text.set({fontSize: text.fontSize-1});
}
canvas.add(text);
text.centerH();
canvas.renderAll();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment