Приклади. Анімаційне малювання з трансформаціями

Квадрат, що обертається та переміщується за вказівником миші

float r = 0;

void setup() {

  size(400, 400); 

  background(255,255,255);

  rectMode(CENTER);  

  fill(255);

}

void draw() {

  rect(width/2, height/2, width, height); 

  translate(mouseX, mouseY);

  rotate(r);

  rect(0, 0, 100, 100);

  r = r + 0.05;

}

Обертання кількох об'єктів

float r = 0;

void setup() {

  size(400, 400);

  background(255);

  noStroke();

  fill(0);

  rectMode(CENTER);

}

void draw() {

  background(255);

  pushMatrix(); 

  translate(100, 100);

  rotate(r);

  rect(0, 0, 80, 80);

  popMatrix();

  pushMatrix(); 

  translate(300, 100);

  rotate(r*0.5);

  rect(0, 0, 80, 80);

  popMatrix();

  pushMatrix(); 

  translate(100, 300);

  rotate(r*2);

  rect(0, 0, 80, 80);

  popMatrix();

  pushMatrix();

  translate(300, 300);

  rotate(r*4);

  rect(0, 0, 80, 80);

  popMatrix();

  r = r + 0.02;

}

Обертання квадратів

float time=0;

void setup() {

  size(512,512);

  frameRate(25);

}

void draw(){

  background(255);

  translate(width*0.5, height*0.5);   //переміщує малювання у центр екрану

  noFill();

  time=time+0.01;

  for (int i=0; i<20; i++) {

    rotate(time);

    rect(i,i,i*5,i*5);  //малювання 20 квадратів із щораз більшою стороною у координатах i,i

  }

}

Круги різних радіусів

float r = 0;

void setup() {

  size(500,500);

  background(10);

}

void draw() {

  translate(width/2, height/2); // переміщення малювання у центр полотна

  fill(255);

  rotate(r); //поворот на r радіан

  float circle_size = random(5, 15); //випадковий вибір радіусу кола

  ellipse(100 + r, 10, circle_size, circle_size); //коло в координатах 100+r, 10 (відступ постійно збільшується разом з r)

  r = r + 0.2; // збільшення кута повороту

}