Double Rainbow All The Way — An HTML5/canvas tutorial by Jim Bumgardner

What does it mean!?
In this tutorial, we’re going to make an animated double rainbow in HTML5 / Canvas. I’m doing this to teach you about the HSL color space, and to show you a more sophisticated way of using it.

I’ll soon have another tutorial which recreates the same examples in Processing.js. Some aspects of this are easier in Processing, and some are easier in HTML5/Canvas – the difficulty is roughly the same for both, I’ve found.

To draw a rainbow, we need a graphics framework to work with. In this tutorial, I’m going to draw everything using the Canvas APIs which are part of HTML5. This means that if you are using an older web browser, like IE 8 or earlier, you’re not going to see anything!

Keep Reading this Tutorial at…

This entry was posted by at0mbxmb on Friday, October 21st, 2011 at 4:42 am and is filed under How To. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response below, or trackback from your own site.

Show/Hide Comments (0)

No Reader Comments (Be The First?)

Leave a Reply