The HTML5 Canvas element can be used to render graphics and text from JavaScript. Here are some pointers for supporting multilingual text in Canvas.

Fonts

Canvas can only support characters which are available on the user’s computer. You should include and use web fonts to maximize language support.

Text Width and Height

When working with non-monospaced fonts, or with diacritic/accent/modifier characters, it is difficult to estimate the width of a string of text only from the length.

Use Canvas’s built-in method, ctx.measureText(STRING) to measure width and height of the text that you are about to print.

Right-to-Left Text

When you use fillText with right-to-left text, put the cursor at the rightmost part of the line and use <canvas dir=”rtl”></canvas>.

Vertical Text

Vertical text is currently not supported in Canvas.