Jouer avec les mathématiques : faire des GIF animé et HTML5 (10 / 15 étapes)

Étape 10 : Avancé:-animation de Nautilus

(lien vers la version animée de HTML5)

C’est un de mes favoris. Faire la spirale était facile (comme on le voit dans les étapes précédentes), mais faire les divisions de chambres a été un véritable défi.

Formule

 OUT_PAUSE = false; FIRST_FRAME_TIME = PI/4; WIDTH = 250; RATIO = 1; TIME_INCREMENT = 0.02; X_MIN = -6; X_MAX = 6; Y_MIN = -6; Y_MAX = 6; FRAMES = PI / TIME_INCREMENT; color rgb(x, y, t) { float radius = dist(x, y, 0, 0); // cartesian to polar float angle = atan2(x, y); // cartesian to polar float sint = sin(t); if(sint<0) { // for negative pitch, have sint positive and negate angle sint = -sint; angle = -angle; } float lrad = log(radius) * 4 * sint; float spiral = cos(angle/2 + lrad); float divisions = spiral > 0 ? sin(sin(angle*4 + sint * lrad * sin(angle/2+lrad - PI/4)/8)*PI/2) : -sin(sin(angle*4 - sint * lrad * sin(angle/2+lrad - PI/4)/8)*PI/2 + PI); float value = spiral * divisions; value = pow(value*value, .05); // make lines thinner float luma = value * 255; return color(luma); }