Simple loading animation in HTML5 canvas

I am looking for a simple image loading animation. I would like to find a short and simple sollution that only uses drawing on the canvas and plain Javascript.

Pleas help

How do I create an HTML5 animation?

You can create animations with HTML5 by combining HTML, CSS, and JavaScript (JS), with which you can build shapes. Also, you can control animations and edit images, video, and audio by means of JS or CSS elements, all of which you then add to a drawing board, which you set up with the <canvas> element.

Is HTML5 Canvas still used?

The HTML5 canvas has the potential to become a staple of the web, enjoying ubiquitous browser and platform support in addition to widespread webpage support, as nearly 90% of websites have ported to HTML5.

I would use a loading GIF generated by an online tool such as Ajaxload.info or Preloaders.net and place it in a div tag that you may toggle in front of the canvas element.

For more spinner generator scripts see 5 Online Loading AJAX Spinner Generator Tools.

Hope this helps!