How to Draw Text on HTML5 Canvas Using JavaScript

In today's video I'll show you how easy it is to draw text on the HTML5 canvas using JavaScript. We take a look at filling text, outlined text and centering text.

For your reference, check this out:

If this video helped you out and you'd like to see more, make sure to leave a like and subscribe to dcode!

#dcode #javascript

[eurostar_]

Exactly what i've wanted to do, thank you!

[girlnextdoor]

Which other method besides filltext.Can I use the line drawing method?

[sayedm]

how to make it with placeholder which can make user put any text to show on the image.

[rileyschenk]

Vary helpful and informative I was giving my self a headache trying to figure out how to center my text thank you!!

[eurostar_]

Could you make a tutorial on how to draw other things such as bars and shapes?

[ayourk]

Not quite right. The zero, zero point of text is in the lower left corner by default. You illustrated that when you refreshed because the text moved down. If it was in the top left corner as you stated, the text would have moved up.