Les rotations
La translation permet de déplacer le centre du repère mais l'intérêt ne saute pas aux yeux de prime abord. La rotation par contre est très intéressante. Elle permet de faire tourner les figures. Comment faire une ellipse qui ne soit pas horizontale ou verticale dans ses axes ? Un rectangle ? Avec la rotation !
La rotation se fait avec la fonction rotate() qui a pour effet de faire pivoter le repère. Attention, le repère pivote toujours autour du centre du repère
Sur l'exemple ci dessus, on a appliqué une rotation avec la fonction rotate(30). Auparavant, on avait défini la gestion des angles en degrés plutôt qu'en radian.
La rotation se faisant toujours autour du centre du repère, elle est très rarement utilisée seule. On utilise d'abord une translation pour déplacer le centre du repère, puis ensuite une rotation autour du nouveau centre du repère.
Sur l'exemple ci dessus, on veut faire tourner le carré vert autour de son centre. On ne peut pas faire une rotation et ensuite tracer le carré. Il faut faire une translation de (6,4), puis ensuite faire une rotation du repère autour de ce nouveau centre et enfin tracer le carré.
Exemple
Dans l'exemple qui vous est donné ci dessous, on fait tourner un carré sur lui même tout en le faisant avancer. On a l'impression qu'il roule.
À faire vous même
Un système soleil - terre - lune
Placez au centre de l'image un disque jaune qui représente le soleil. Faites tourner autour de ce disque un disque bleu qui représente la terre et autour de la terre un disque gris qui représente la lune.
Vous pouvez matérialiser les orbites en utilisant des cercles fins et gris.
Les carrés volants
Vous ferez volez à travers la page trois carrés de taille et de couleur différente. Ils iront à des vitesses différentes (aléatoires de préférence) et tourneront sur eux même au fur et à mesure qu'ils avancent.
L'utilisation des fonctions push et pop sera bien entendu indispensable.