Fabric.js 2.0 breakWords Implementation

Published on 6/11/2018 by Justin Williamson


EDIT 8/26/2021 - The splitByGrapheme option seems to be working great in v4 and renders all of this shit unnecessary. Woohoo!

EDIT 6/3/2019 - It looks like the splitByGrapheme option has been fixed and is working in fabric 3.0. It is an alternate approach than the one shown here.

One of my favorite fabric.js hacks was the breakWords function . This would allow Textbox objects to hold a maximum width by forcing a line break when a long word could not be contained.

Unfortunately this functionality was broken in fabric 2.0. I busted my ass a bit trying to figure this out - here's what I came up with:

Note that there are still some problems as pointed out here . It's a start, though.

You might also enjoy...

Scale and Center Images with Imagemagick

Bootstrap 4 Tab Persistence

jQuery DataTables Column Totals that Update with Filtering