Better positioning of text using measureText with HTML5 Canvas

In this example I am extending the Loading Progress Animation example and improving the text positioning.

In the previous example I placed the text at a specific location. However this meant that it wasnt always centered as some text is longer than others (1% vs 100%).

In this quick example I am adding in some more complex positioning of the text using textMeasurements.

Example code and full tutorial

The full code is available by viewing the source of the below frame. If you want more detailed instructions there is my blog post I talk through the code step by step.