|
var soleilPosX = canv58.width/2;
// Soleil au centre
var soleilPosY = canv58.height/2;
var soleilDiametre = 100;
var soleilCouleur =
"yellow";
var planete1PosX = 70;
//Planète 1
var planete1PosY = 70;
var planete1Diametre =
20;
var planete1Couleur =
"forestgreen";
var planete1Vitesse = 2;
var planete2PosX = 180;
//Planète 2
var planete2PosY = 0;
var planete2Diametre =
30;
var planete2Couleur =
"blue";
var planete2Vitesse =
1.5;
var satellitePosX = 30;
//Satellite de la planète 2
var satellitePosY = 0;
var satelliteDiametre =
10;
var satelliteCouleur = "Coral";
var satelliteVitesse =
10;
var i = 0;
function animate(){
context58.clearRect(0, 0,
canv58.width, canv58.height);
context58.fillStyle = "black";
//Fond noir
context58.fillRect(0, 0,
canv58.width, canv58.height);
context58.beginPath(); //Dessin du soleil
context58.arc(soleilPosX, soleilPosY, soleilDiametre/2,
0, Math.PI*2);
context58.fillStyle = soleilCouleur;
context58.fill();
context58.save();
//Dessin de la planète 1
context58.translate(canv58.width/2,canv58.height/2);
context58.rotate(i * planete1Vitesse);
context58.beginPath();
context58.arc(planete1PosX, planete1PosY, planete1Diametre/2,
0, Math.PI*2);
context58.fillStyle = planete1Couleur;
context58.fill();
context58.restore();
context58.save();
//Dessin de la planète 2
context58.translate(canv58.width/2,canv58.height/2);
context58.rotate(i * planete2Vitesse);
context58.beginPath();
context58.arc(planete2PosX, planete2PosY, planete2Diametre/2,
0, Math.PI*2);
context58.fillStyle = planete2Couleur;
context58.fill();
context58.save();
// Dessin du satellite de la planète 2
context58.translate(planete2PosX, planete2PosY);
context58.rotate(i * satelliteVitesse);
context58.beginPath();
context58.arc(satellitePosX, satellitePosY, satelliteDiametre/2,
0, Math.PI*2);
context58.fillStyle = soleilCouleur;
context58.fill();
context58.restore(); // Restaure le contexte que le
sauvegarger pour le satellite
context58.restore();
i += 0.01;
window.requestAnimFrame(function() {
animate() });
}
animate();
|
|