processing : un sketch qui ne fonctionne pas sur une page HTML (bis)

Capitoul · 2018-02-13 11:50:25

Bonjour,

Peut-être aurais-je plus de chance de réponse en joignant le code du sketch !!

Voici un fichier collier.pde et un fichier collier.HTML qui visualise l'animation précédente.

Merci de m'expliquer pourquoi je ne retrouve pas dans la page HTML le contenu du sketch

Je retrouve ce problème chaque fois que le background de la boucle draw n'est pas re-initialisé.

Capitoul

_______________________________________________________

// données
float theta=PI/2; // déplacement du point sur grand cercle
float delta_theta = 2*PI/1000;
float rho = 0; // déplacement point sur petit cercle
float delta_rho= PI/10;
float rayonCercle = 200;

void setup() {
size (800, 600, P3D);
smooth(8);
frameRate(40);
lights();
ortho(-width/2, width/2, -height/2, height/2, 0, 1000);
rayonCercle = 150;
background(50);

}

void draw() {

fill(255);

stroke(255);
translate (width/2, height/2);

rotateX (PI/2.5); // Mise en perspective

// tracé grand cercle

stroke(255);
strokeWeight(2);
noFill();
ellipse(0, 0, 2*rayonCercle, 2*rayonCercle);

//calcul du point décrivant le grand cercle

strokeWeight(1);
float xM = rayonCercle*cos(theta);
float yM = rayonCercle*sin(theta);

translate (xM, yM); //translation vers grand cercle

// calcul du point courant sur le petit cercle
rotateX(PI/2); // cercle vertical
rotateY(theta); // déplacement du point sur le petiit cercle

float xN = 15*cos(rho);
float yN = 15*sin(rho);
translate (xN, yN); // Translation vers le cercle de nutation (pour tracé point tournant
stroke(255, 255, 0);
sphere(1); // tracé point du petit cercle
translate (-xN, -yN); // retour centre petit cercle

translate(-xM, -yM); // retour centre grand cercle

// Itérations
theta = theta - delta_theta;
if (theta <-2*PI) {
theta = 0;
}

rho = rho-delta_rho;
if (rho <-2*PI) {
rho = 0;
}

}
_______________________________________________________
fichier HTML
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Test</title>
<link rel="stylesheet" href="saisons_eclipses_marees.css">
<script src="script.js"></script>
<script src="processing-3.3.5.min.js"></script>
<script type="text/javascript" src="processing.js"></script>
<style type="text/css">

</style>
</head>

<body>

<div style="text-align:center; width:400; height:400"">

<canvas data-processing-sources="collier/collier.pde"></canvas>

</div>

</body>
</html>

Annonce

#1 2018-02-13 11:50:25 un sketch qui ne fonctionne pas sur une page HTML (bis)

un sketch qui ne fonctionne pas sur une page HTML (bis)

Pied de page des forums