De curven met raaklijnen, anker- en controlepunten.

De curven met raaklijnen, anker- en controlepunten.

 

 

 

 

 

Bezier Quadratic animatie, 8 objecten in een vierkant.            terug naar de inleiding              ga naar de animatie in fullScreen():

Met de "s" toets stopt, en met de "r" toets start de animatie. Met de "d" toets kan je een afbeelding van de animatie downloaden.

De schets maakt gebruik van de class "BezierQuadr"  zie  curven classes   en de superclass ¨Curven¨

De ankerpunten van de objecten bevinden zich bij het starten van de animatie in het x,y punt.
De ankerpunten van objecten 1 t/m 4 bewegen zich diagonaal naar buiten, en die van 5 t/m 8 bewegen zich diagonaal naar binnen.

De (gele) controlepunten van objecten 1 t/m 4 staan op 7*n vanaf het x,y punt, en die van 5 t/m 8 staan op 15*n vanaf het x,y punt.

Zie ook de Bezier Quadratic curve constructor creator

 
 
 

Curven object1, object2, object3, object4; 
Curven object5, object6, object7, object8; 
 
void setup() {   
size(960, 540);   
//fullScreen(); 
 float x = width/2; 
 float y = height/2; 
 float n = height/30; 
                      //  ankerpunten a1 en a2 en controlepunt c1 
 object1 = new BezierQuadr(x,y,      x,y,      x, y-7*n,      
                          color(235, 17, 17,100));                           
                           
 object2 = new BezierQuadr(x,y,      x,y,       x, y+7*n,                            
                          color(0, 250, 17, 100));                          
                                        
 object3 = new BezierQuadr(x,y,      x,y,      x-7*n, y,                           
                          color(0, 17, 255, 100));                        
                                      
 object4 = new BezierQuadr(x,y,      x,y,      x+7*n, y,         
                          color(235, 255, 17, 100));   
                           
 object5 = new BezierQuadr(x,y,      x,y,      x, y-15*n,      
                          color(0, 250, 17,100));                            
                           
 object6 = new BezierQuadr(x,y,      x,y,      x, y+15*n,                            
                          color(235, 17, 17,100));                           
                                    
 object7 = new BezierQuadr(x,y,      x,y,      x-15*n, y,                           
                          color(235, 250, 17, 100));                           
                                       
 object8 = new BezierQuadr(x,y,      x,y,      x+15*n, y,         
                          color(0, 0, 255, 100));                                      
} 
 
void draw() {  
 background(#E6FBFF); 
 strokeWeight(1);  
  object1.display(); 
  object1.xya1LiBo(); 
  object1.xya2ReBo(); 
 
  object2.display();  
  object2.xya1LiOn(); 
  object2.xya2ReOn(); 
   
  object3.display(); 
  object3.xya1LiBo(); 
  object3.xya2LiOn(); 
   
  object4.display(); 
  object4.xya1ReBo(); 
  object4.xya2ReOn(); 
   
  object5.display(); 
  object5.xya2ReOn(); 
  object5.xya1LiOn(); 
 
  object6.display();  
  object6.xya1ReBo(); 
  object6.xya2LiBo(); 
   
  object7.display(); 
  object7.xya2ReOn(); 
  object7.xya1ReBo(); 
   
  object8.display(); 
  object8.xya1LiOn(); 
  object8.xya2LiBo(); 
} 
 
void keyPressed() {   
 if (key == 's') {   
 noLoop();   
 }   
 if (key == 'r') {   
 loop();   
 }   
}