Text wrap in a element

Question

I am trying to add text on an image using the element. First the image is drawn and on the image the text is drawn. So far so good.

But w

Answer 1

look at https://developer.mozilla.org/en/Drawing_text_using_a_canvas#measureText%28%29

If you can see the selected text, and see its wider than your canvas, you can remove words, until the text is short enough. With the removed words, you can start at the second line and do the same.

Of course, this will not be very efficient, so you can improve it by not removing one word, but multiple words if you see the text is much wider than the canvas width.

I did not research, but maybe their are even javascript libraries that do this for you