Canvas Demo 2

Aus ProgrammingWiki
var x = 50;
var y = 0;
var angle = 45;

var r = 0; var g = 0; var b = 0;
var state = 0;

function bounce() {
 angle = angle +45 -5+Math.round(Math.random()*5);
 if (angle > 360) angle = angle -360;
 if (angle < 0) angle = angle +360;
}

function advance(){ 
  if (y >  80) bounce();
  if (y < -80) bounce();
  if (x >  280) bounce();
  if (x < -280) bounce();
  x = x + 10*Math.cos(angle*Math.PI/180); 
  y = y + 10*Math.sin(angle*Math.PI/180); 
  if (state == 0){
   if(r<255){ 
      r++;
      canvas.setColor(r,g,255-r);
   }else{state = 1;}
  }
  if (state == 1){
   if(g<255){ 
      g++;
      canvas.setColor(255-g,g,b);
   }else{state = 2;}
  }
  if (state == 2){
   if(b<255){ 
      b++;
      canvas.setColor(0,255-b,b);
   }else{state = 0; r=0; g=0; b=0;}
  }
}
canvas.clear();

for (var i =0; i<200; i++){
 canvas.setWidth(3);
 canvas.ellipse(x+300,y+100,3);
 advance();
}
Canvas Demo 2

Suche
