Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Magnus Haukeland
Magnus Haukeland
38 Points

How to animate a windmill?

Hey guys

I'm working on a drawing with canvas. Its a javascript and in this drawing i have a windmill, which I want to add an animation to. I want the blades on the windmill to spin. Have any of you some tips about how i can do this?

3 Answers

MDN has a page on Basic animations for Canvas. Their examples include a few circular things with rotations, so probably a good place to start!

Magnus Haukeland
Magnus Haukeland
38 Points

I have seen this page before and have had a look at the code used in the clock-example. But I struggle to understand what the different codes does. Can anyone try to help me understand the different lines of codes?

That's a fairly large request to go line by line and explain what each does.

I'd suggest getting a copy of the code either on your own computer or in Workspaces, then keep removing or changing the code on each line to see what is different.

Also, compare the various examples and note down what is the same or similar and what is different.

There are also a number of tutorials floating around on the web about HTML5 Canvas animation: