- Explore examples page

Modulo gives you the remainder of a division.
If you modulo a number X with 5, the remainder will be 0-4 regardless of what the value of X.

                    x/5            x%5
0 / 5 --> divide by  0,  remainder  0
1 / 5 --> divide by  0,  remainder  1
2 / 5 --> divide by  0,  remainder  2
3 / 5 --> divide by  0,  remainder  3
4 / 5 --> divide by  0,  remainder  4

5 / 5 --> divide by  1,  remainder  0
6 / 5 --> divide by  1,  remainder  1
7 / 5 --> divide by  1,  remainder  2
8 / 5 --> divide by  1,  remainder  3

             ...

Useful for creating a number that rewinds itself automatically. In the above example, as x increments infintely the result of x%5 is contained within the range of 0 to 5

int x = 0;

void setup(){
  size(200, 200);
}

void draw() {
  background(200);

  x = x + 1;       // increment x by 1
  x = x % width;   // divide by width of the window and get the remainder. x should be between 0 - 199

  line(x, 0, x, height);
}

- map function maps a range of numbers (0 to 17) to another range (20 to 460) in the below example.

void setup() {
  size(400, 200);
  noStroke();
}

void draw() {
  background(204);
  
  // map range (0-width) to (30-370)
  float x2 = map(mouseX, 0, width, 30, 370);
  fill(0,255,0);            //green
  ellipse(x2, 125, 20, 20);
  
  // map range (0-width) to (30-170)
  float y1 = map(mouseX, 0, width, 30, 170);
  fill(0,0,255);             // blue
  ellipse(10, y1, 20, 20);

}

Read Ch6 for details. PushMatrix() and PopMatrix() allows you to use functions that transform the coordinate system (translate, rotate) and revert back to the original coordinate system.

int r = 0;

void setup(){
  size(400, 400, P3D);
  frameRate(30);
}

void draw(){

  //background(180);
  
  pushMatrix();          // create new coordinate system and push onto stack
  translate(50, 50);
  rotate(degrees(r));
  rect(0, 0, 30, 30);  
  popMatrix();           // pop stack to revert to original coordinate system
  
  
  pushMatrix();
  translate(200, 50);
  rotate(degrees(r));
  rect(0, 0, 30, 30);  
  popMatrix();
  
  
  pushMatrix();
  translate(50, 200);
  rotateX(degrees(r));
  rect(0, 0, 30, 30);  
  popMatrix();
  
  
  pushMatrix();
  translate(200, 200);
  rotateY(degrees(r));
  rect(0, 0, 30, 30);  
  popMatrix();
  
  pushMatrix();
  translate(350, 200);
  rotateZ(degrees(r));
  rect(0, 0, 30, 30);  
  popMatrix();

  r++;
  r = r%360;

}

Sine and cosine functions are useful because for any input x you get result sin(x) that is within a range (-1 to 1).
source: wikipedia

float x = 0;
float y = 0;
float y2 = 0;

int amp = 50;

void setup(){
  size(400, 200);
}

void draw(){
  background(180);
  
  fill(0);
  y = sin(x) * amp;
  ellipse(x, y + 100, 10, 10);
  
  fill(255);
  y2 = cos(x) * amp;
  ellipse(x, y2 + 100, 10, 10);
  
  x = x + 0.1;
  
  if(x >= width){
    x = 0;
  }
}

See [sine][sinecosine][sinewave]

noise() function takes a input and generates a number between 0.0 - 1.0

float xoff = 0.0;
void setup(){
  size(400, 200);
}

void draw() {
  background(204);
  xoff = xoff + .01;
  float n = noise(xoff) * width;
  line(n, 0, n, height);
}

See [noise1d][noise2d][random]

- ALib1@Presstube by James Paterson

- [sequential]

A hybrid where a screen is reimagined as a file. And the file becomes part of the screen.

PImage img;

void setup() {
  size(640, 360);
  background(102);
  saveFrame("grab.png");        // make sure the file grab.png exists before I try to load
}

void draw() {
  stroke(255);
  img = loadImage("grab.png");
  image(img, 10, 10);           // move the captured image by 10,10
  if (mousePressed == true) {
    line(mouseX, mouseY, pmouseX, pmouseY);
  }
   saveFrame("grab.png"); 
}

1. Sketch -> Import Library -> Add Library
2. Search for GifAnimation and install
2. You should see the example files show up in the Exmaples -> Contributed Libraries folder

import gifAnimation.*;    // import gifanimation library
GifMaker gifExport;       // make a variable named gifExport of type GifMaker
int x = 0;

public void setup() {
  size(100, 100);
  frameRate(12);
  stroke(255, 128, 128);
  
  gifExport = new GifMaker(this, "export.gif");               // export to file "export.gif"
  gifExport.setRepeat(0);                                     // make it an "endless" animation
}

void draw() {
  background(0);
  
  x = x + 1;       // increment x by 1
  x = x % width;   // divide by width of the window and get the remainder. x should be between 0 - 199

  line(x, 0, x, height);
  
  gifExport.setDelay(1);                                       // set framerate for gif animation
  gifExport.addFrame();
}

void keyPressed() {
  gifExport.finish();                              // finish recording to gif
  println("gif saved");
}

Non recursive program:

void setup() {
  size(640, 360);
  noStroke();
  noLoop();
  fill(0, 90);
}

void draw() {
   drawCircle(10, 20); 
   drawCircle(50, 20); 
   drawCircle(90, 20); 
   drawCircle(120, 20); 
   drawCircle(150, 20); 
   drawCircle(190, 20); 
   drawCircle(210, 20); 
   drawCircle(250, 20); 
   drawCircle(290, 20); 
   drawCircle(220, 20); 
   drawCircle(250, 20); 
   drawCircle(290, 20); 
}

void drawCircle(int x, int radius) {                    
  ellipse(x, height/2, radius*2, radius*2);      

}

Recursive program:

void setup() {
  size(640, 360);
  noStroke();
  noLoop();
  fill(0, 90);
}

void draw() {
  drawCircle(width/2, 280); 
}



void drawCircle(int x, int radius) {                    
 
  ellipse(x, height/2, radius*2, radius*2);      

  if(radius > 10) {
    drawCircle(x - radius/2, radius/2);         //calling drawCircle from within drawCircle
    drawCircle(x + radius/2, radius/2);
  }

}

• Recursive tree
• Koch curve
  Other fractals/chaos related algorithmic systems
• mandel brot zoom viewer on OpenProcessing
• Mandelrot fractal
• Penrose Tile L-system
• Game of Life
• Wolfram Celluar Automata

These all require understanding of Objects/Classes. Read Ch10 of textbook. A good simple example in Ch10 (JitterBug)

Examples of simulations:

• Flocking
• Springs
• Chain
• Simple Particle System
• Multiple Particle Systems
• Forces With Vectors
• Smoke Particle System