Logique
Boucles
Math
Texte
Listes
Données
Variables
Fonctions
Programmation
p5.js
Objets web
Propriétés
Formes
Tortue
Apparence
GeoGebra
var canvas, dimGraphiques, dimCanvas, compteur, g1, g2, g3, g4, gliss1, gliss2, gliss3, a, b, c, x, min, max, u, dim, nb, amplitude, nbb, rayon, niveau, variationAngle, facteur, contenant, ligne1, ligne2, case2, ligne3, n, glissN, alpha, glissAlpha, echelle, glissEchelle, vitRot, glissVitRot, rot, y, i, couleurs, r, glissFrac, fract, delta, glissEch, a1, a2, a3, b1, b2, b3, x1, x3, y1, y3, x2, y2, nMax, sierpCouleurs, texte1, texte2, texte3, texte0, menu1, ligne0, zoneGraphGliss, zoneGraphParam, zg, j, temp, g5, zAngle; /** * Fonction exécutée une fois, au départ */ function actions_initiales() { dimGraphiques = 400; dimCanvas = dimGraphiques; compteur = 0; g1=creerZoneGraphique(dimGraphiques,dimGraphiques); createSpan("").style("display","inline-block").style("width","5px"); g2=creerZoneGraphique(dimGraphiques,dimGraphiques); createSpan("<br>"); g3=creerZoneGraphique(dimGraphiques,dimGraphiques); createSpan("").style("display","inline-block").style("width","5px"); g4=creerZoneGraphique(dimGraphiques,dimGraphiques); createSpan("<br>"); g5=creerZoneGraphique(dimGraphiques,dimGraphiques); cacherObjetPrudent("g5",g5); texte0=createSpan('Les glissières modifient '); menu1=creerMenuLocal(['la zone graphique en haut à gauche', 'la zone graphique en haut à droite', 'la zone graphique en bas à gauche', 'la zone graphique en bas à droite', 'le canvas central']); siChangementPrudent("menu1",menu1,"choix_dans_le_menu",choix_dans_le_menu); ligne0=createSpan("<br>"); texte1=createSpan('Taille '); gliss1=createSlider(0,1,1,0.01); ligne1=createSpan("<br>"); texte2=createSpan('Nombre '); gliss2=createSlider(0,1,1,0.01); ligne2=createSpan("<br>"); texte3=createSpan('Autre '); gliss3=createSlider(0,1,1,0.01); ligne3=createSpan("<br>"); case2=createCheckbox('Transparence',true); canevas=creerCanvas(dimCanvas,dimCanvas); canvas=canevas; contenant=createElement('div',''); stylerObjetPrudent("contenant",contenant,'text-align','center'); stylerObjetPrudent("contenant",contenant,'width',(String(2 * dimGraphiques) + String('px'))); assignerParentPrudent("texte0",texte0,"contenant",contenant); assignerParentPrudent("menu1",menu1,"contenant",contenant); assignerParentPrudent("ligne0",ligne0,"contenant",contenant); assignerParentPrudent("texte1",texte1,"contenant",contenant); assignerParentPrudent("gliss1",gliss1,"contenant",contenant); assignerParentPrudent("ligne1",ligne1,"contenant",contenant); assignerParentPrudent("texte2",texte2,"contenant",contenant); assignerParentPrudent("gliss2",gliss2,"contenant",contenant); assignerParentPrudent("ligne2",ligne2,"contenant",contenant); assignerParentPrudent("texte3",texte3,"contenant",contenant); assignerParentPrudent("gliss3",gliss3,"contenant",contenant); assignerParentPrudent("ligne3",ligne3,"contenant",contenant); assignerParentPrudent("case2",case2,"contenant",contenant); stylerObjetPrudent("gliss1",gliss1,'width','320px'); stylerObjetPrudent("gliss2",gliss2,'width','320px'); stylerObjetPrudent("gliss3",gliss3,'width','320px'); zoneGraphGliss = 0; zoneGraphParam = [[1, 0.5, 0.5], [0.3, 1, 0.51], [1, 0.5, 0], [1, 0, 0.9], [0.5, 1, 1]]; positionner(); definirCouleurs(); definirRemplissage(); choix_dans_le_menu(); } /** * Fonction exécutée périodiquement, de façon répétée */ function actions_en_boucle() { zoneGraphParam[zoneGraphGliss] = [valeurPrudent("gliss1",gliss1), valeurPrudent("gliss2",gliss2), valeurPrudent("gliss3",gliss3)]; passer_a_la_zone_graphique(0, g1); ellipses_tournantes(a, b, c); passer_a_la_zone_graphique(1, g2); spirales_polygonales(a, b, c); passer_a_la_zone_graphique(2, g3); sierpinski(a, b, c); passer_a_la_zone_graphique(3, g4); polygones_tournants(a, b, c); choisirZoneGraphique(g5); tracer_graphique_cache(); passer_a_la_zone_graphique(4, canvas); figure_canvas(a, b, c); compteur = (compteur + 1) % 360; } /** * Décrire cette fonction… */ function passer_a_la_zone_graphique(n, zg) { choisirZoneGraphique(zg); temp = zoneGraphParam[n]; a = temp[0]; b = temp[1]; c = temp[2]; } /** * Décrire cette fonction… */ function ellipses_tournantes(dim, nb, alpha) { couleurFondC((color(255,200,200,255))); dim = modifier(dim, 1, dimGraphiques / 2 - 5); nb = Math.round(modifier(nb, 1, 20)); alpha = modifier(alpha, 0, dim / 25); strokeWeight_(0); fill_((color(255,0,0,255))); leGraphicsActif.resetMatrix(); leGraphicsActif.translate((leGraphicsActif.width / 2),(leGraphicsActif.height / 2)); leGraphicsActif.rotate(radians((2 * (compteur % 360)))); for (var count = 0; count < nb; count++) { ellipse_(0,0,dim,alpha); leGraphicsActif.rotate(radians((180 / nb))); } } /** * Décrire cette fonction… */ function modifier(x, min, max) { return min + x * (max - min); } /** * Décrire cette fonction… */ function spirales_polygonales(echelle, nb, alpha) { couleurFondC((color(200,255,200,255))); stroke_((color(0,50,0,255))); echelle = modifier(echelle, 0.01, 10); nb = Math.round(modifier(nb, 1, 1000)); alpha = modifier(alpha, 30, 150); sautePos((leGraphicsActif.width / 2),(leGraphicsActif.height / 2)); fixeCap((-1 * compteur)); x = posXsouris() - 0.5 * dimCanvas; y = posYsouris() + (leGraphicsActif.height - 0.5 * dimCanvas); if (mouseIsPressed && x > 0 && x < leGraphicsActif.width && y > 0 && y < leGraphicsActif.height) { sautePos(x,y); } for (i = 1; i <= nb; i += abs(1)) { avance((echelle * i)); droite(alpha); } } function mathRandomInt(a, b) { if (a > b) { // Swap a and b to ensure a is smaller. var c = a; a = b; b = c; } return Math.floor(Math.random() * (b - a + 1) + a); } /** * Décrire cette fonction… */ function definirCouleurs() { fract = 0; couleurs = []; for (i = 1; i <= 1000; i += abs(1)) { couleurs[i] = (color((mathRandomInt(0, 255)),(mathRandomInt(0, 255)),(mathRandomInt(0, 255)),255)); } } /** * Décrire cette fonction… */ function sierpinski(rayon, niveau, variationAngle) { couleurFondC((color(200,200,255,255))); rayon = modifier(rayon, 0, dimGraphiques / 2); niveau = Math.round(modifier(niveau, 0, 6)); variationAngle = modifier(variationAngle, 0, 360); nMax = niveau + 1; leGraphicsActif.resetMatrix(); leGraphicsActif.translate((dimGraphiques / 2),(dimGraphiques / 2)); x1 = rayon * Math.cos((120 + compteur) / 180 * Math.PI); y1 = rayon * Math.sin((120 + compteur) / 180 * Math.PI); x2 = rayon * Math.cos((240 + compteur) / 180 * Math.PI); y2 = rayon * Math.sin((240 + compteur) / 180 * Math.PI); x3 = rayon * Math.cos((variationAngle + compteur) / 180 * Math.PI); y3 = rayon * Math.sin((variationAngle + compteur) / 180 * Math.PI); noFill_(); cercle_(0,0,rayon); triangle_(x1,y1,x2,y2,x3,y3); tracer_sierpinski(niveau, x1, y1, x2, y2, x3, y3); } /** * Décrire cette fonction… */ function definirRemplissage() { sierpCouleurs = [color(45,128,255,255), color(255,0,0,255), color(0,255,0,255), color(0,0,255,255), color(0,255,255,255), color(255,0,255,255), color(255,255,0,255), color(255,128,45,255), color(0,0,0,255)]; } /** * Décrire cette fonction… */ function polygones_tournants(rayon, nb, facteur) { couleurFondC((color(255,255,200,255))); rayon = modifier(rayon, 0, dimGraphiques / 2); nb = Math.round(modifier(nb, 3, 10)); echelle = modifier(facteur, 0.5, 0.99); fract = modifier(compteur, 0, 0.99); alpha = 0; delta = fract * (360 / nb); for (i = 1; i <= 500; i += abs(1)) { fill_((couleurs[i])); poly(nb, rayon, dimGraphiques / 2, dimGraphiques / 2, alpha); rayon = rayon * echelle; alpha = alpha + delta; } } /** * Décrire cette fonction… */ function choix_dans_le_menu() { if (valeurPrudent("menu1",menu1) == 'la zone graphique en haut à gauche') { zoneGraphGliss = 0; } if (valeurPrudent("menu1",menu1) == 'la zone graphique en haut à droite') { zoneGraphGliss = 1; } if (valeurPrudent("menu1",menu1) == 'la zone graphique en bas à gauche') { zoneGraphGliss = 2; } if (valeurPrudent("menu1",menu1) == 'la zone graphique en bas à droite') { zoneGraphGliss = 3; } if (valeurPrudent("menu1",menu1) == 'le canvas central') { zoneGraphGliss = 4; } temp = zoneGraphParam[zoneGraphGliss]; a = temp[0]; b = temp[1]; c = temp[2]; fixeValeurPrudent("gliss1",gliss1,a); fixeValeurPrudent("gliss2",gliss2,b); fixeValeurPrudent("gliss3",gliss3,c); fixeContenuPrudent("texte3",texte3,(['Épaisseur', 'Angle', 'Position', 'Variation', 'Amplitude'][zoneGraphGliss])); } /** * Trace le triangle de Sierpinski */ function tracer_sierpinski(n, x1, y1, x2, y2, x3, y3) { var a1; var a2; var a3; var b1; var b2; var b3; a1 = (x1 + x3) / 2; b1 = (y1 + y3) / 2; a2 = (x2 + x3) / 2; b2 = (y2 + y3) / 2; a3 = (x1 + x2) / 2; b3 = (y1 + y2) / 2; if (n > 0) { fill_((sierpCouleurs[((nMax - n) - 1)])); triangle_(a1,b1,a2,b2,a3,b3); tracer_sierpinski(n - 1, a1, b1, a2, b2, x3, y3); tracer_sierpinski(n - 1, x1, y1, a3, b3, a1, b1); tracer_sierpinski(n - 1, a3, b3, x2, y2, a2, b2); } } /** * Décrire cette fonction… */ function positionner() { positionnerObjetPrudent("g1",g1,0,0); positionnerObjetPrudent("g2",g2,dimGraphiques,0); positionnerObjetPrudent("g3",g3,0,dimGraphiques); positionnerObjetPrudent("g4",g4,dimGraphiques,dimGraphiques); positionnerObjetPrudent("contenant",contenant,0,(2 * dimGraphiques + 20)); } /** * Décrire cette fonction… */ function poly(n, r, x, y, alpha) { strokeWeight_(0); debutPoly(); var repeat_end = n + 1; for (var count2 = 0; count2 < repeat_end; count2++) { sommet((x + r * Math.cos(alpha / 180 * Math.PI)),(y + r * Math.sin(alpha / 180 * Math.PI))); alpha = alpha + 360 / n; } finPoly(); } /** * Décrire cette fonction… */ function tracer_graphique_cache() { zAngle = 119; couleurFondC((color(0,255,255,255))); sautePos((leGraphicsActif.width / 2),(leGraphicsActif.height / 2)); fixeCap((-3 * compteur)); for (i = 1; i <= 1000; i += abs(1)) { avance((1.9 * i)); droite(zAngle); zAngle = zAngle + 0.005; } } /** * Décrire cette fonction… */ function figure_canvas(dim, nb, amplitude) { dimCanvas = Math.round(modifier(dim, 0, 2 * dimGraphiques)); nb = Math.round(modifier(nb, 3, 12)); amplitude = Math.round(modifier(amplitude, 0, 180)); if (etatCasePrudent("case2",case2)) { zoneGraphiqueTransparente(); } else { couleurFondC((color(266,266,266,255))); // 'On peut traiter une zone graphique comme un objet image' if (false) {image(g5,0,0)} else {image(g5,0,0,width,height)} } strokeWeight_(1); stroke_((color(0,0,0,255))); fill_((color(235,37,96,255))); canevas=creerCanvas(dimCanvas,dimCanvas); canvas=canevas; leGraphicsActif.textSize((Math.round(dimCanvas / 10))); positionnerObjetPrudent("canvas",canvas,(dimGraphiques - dimCanvas / 2),(dimGraphiques - dimCanvas / 2)); leGraphicsActif.resetMatrix(); leGraphicsActif.translate((leGraphicsActif.width / 2),(leGraphicsActif.height / 2)); leGraphicsActif.rotate(radians((amplitude * Math.sin(compteur / 180 * Math.PI)))); for (var count3 = 0; count3 < nb; count3++) { leGraphicsActif.text('p5Visuel',(Math.round(dimCanvas / 10)),0); leGraphicsActif.rotate(radians((360 / nb))); } } //dimGraphiques;