HTML5 : Text on canvas

Moving on next in our Canvas study, lets see how to draw some text in canvas. The code looks as

context.font = "italic 30px serif";
context.lineWidth   = 4;
textContent="Hello world.";
context.strokeText(textContent, 40, 240);
context.fillText(textContent, 40, 240);

The code should be familiar to you now. First we define the font style, size and type. Then there are as usual two kinds of methods to text, either stroke or fill. First the font type and size is defined. Then line width is defined and finally we stroke the text content with

context.strokeText(textContent, 40, 240);

If the content needs to be filled without the outline, we use fill method as

context.fillText(textContent, 40, 240);

The first parameter is the content to be written. The second and third parameter is the start x and start y of the content.

Thats all to draw the content on the HTML5 Canvas.