Circular Scanner

processing, motion, chance, class, repeat, Law of Common Fate
Fabian Morón Zirfas
Visualizes the "Law of Common Fate". Elements with the same directional motion and/or same speed are seen as a group.
// simple sketch that creates a sort of scanner

//These are unused but got to have if you want to see the
//simple code where it comes from in the draw
//int x = 0;
int step = 100; // step is just used to for the circles in the background
//int radius = 300;
//float off = .0;

//Create some new scanners
ScannPoint scanner;
ScannPoint another_scanner;
// we also can have a list of scanners
ArrayList <ScannPoint> scanns;

void setup() {

  size(800, 800, P2D);

  colorMode(HSB, 360, 100, 100); // because HSB is cooler
  scanns = new ArrayList<ScannPoint>(); // init the list


  // ScannPoint(float _radius, color _c, float _w, float _amount, float _x)
  // radius is the radius of the orbit
  // color is the color of the ellipse
  // w is the width of the ellipse
  // amount is the amount the ellipse can differ from its orbit
  // x is the starting point of the ellipse

  scanner = new ScannPoint(300, color(260, 90, 90), 5, 100, 90);
  another_scanner = new ScannPoint(305, color(360, 90, 90), 5, 100, 90);

  // fill the list with new scan points
  for (int i = 100; i < 300; i+=5) {
    scanns.add(new ScannPoint(i, color(160, 90, 90), 5, random(10, 100), random(360)));
  }
  smooth(2);
}
void draw() {

  bg_and_ranges(); // clear the bg and draw the circles
  for (int i = 0; i < scanns.size(); i++) {
    scanns.get(i).run();
  }
  scanner.run(); // run one scanner
  another_scanner.run(); // run another
   // saveFrame("seq/out-####.png");
   // if(frameCount == 250) exit();
}
// the scanner class
class ScannPoint {
  private float x = 0; // this is the point where we start on the circle
  private float off = 0.0;// this is for the noise the scann point takes
  private float n; // also for noise
  public float amount; // the amount it moves from its orbit
  public float radius; // the radius around the center
  public color c;// its color
  public float w; // its width

  // init 
  ScannPoint(float _radius, color _c, float _w, float _amount, float _x) {
    this.radius = _radius;
    this.c = _c;
    this.w = _w;
    this.amount = _amount;
    this.x = _x;
  }

  // update all its variables
  private void update () {
    this.x++;
    this.off+=.01;
    this.n = noise(this.off) * this.amount;
  }

  // display it
  private void display() {
    // push it to the center of the canvas
    pushMatrix();
    translate(width/2, height/2);// bring zero point to the center
   
   // calc the xy on the circle 
    float px = sin(radians(this.x%360))*(this.radius + this.n); 
    float py = cos(radians(this.x%360))*(this.radius + this.n);
    
    fill(this.c);// color
    ellipse (px, py, this.w, this.w );// draw it
    // pop matrix back
    popMatrix();
  }

  public void run() {
    update();
    display();
  }
}


void bg_and_ranges() {
  // delete the bg
  noStroke();
  fill(0, 10);
  rect(0, 0, width, height);
  // draw the circles in the bg
  stroke(128);
  noFill();
  for (int i = 1; i < 8; i++) {
    ellipse(width/2, height/2, (width - step* i), (width - step*i));
  }
}