Astroid

by Peter Farrell

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.2/p5.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.2/addons/p5.dom.js"></script>

JavaScript

var dSlider;
var xrange = 600;
var yrange = 600;
var w = xrange/2;
var d; //distance between lines
var ang = 0; //rotation angle

function setup(){
	createCanvas(600,600);
  background(51);
  var ran = stroke(random(255),random(255),random(255));
  dSlider = createSlider(1,30,4);
  dSlider.position(10,10);
}

function draw(){
	background(255);
  
  translate(w,height/2);
  for (var j=0; j<12;j++){
  push();
    rotate(2*PI*j/12);
  translate(150,0);
  rotate(ang)
  astroid(50);
  ang += 0.01;

  pop();
  }
}

function astroid(size){
d = dSlider.value();
for (var i=-size;i<1; i+= d){
    //stroke(random(255),random(255),random(255));
    stroke(abs(i),abs(size+i),abs(600+i)%255)
  	line(i,0,0,size+i);
  	line(i,0,0,-size-i);
  	line(-i,0,0,size+i);
  	line(-i,0,0,-size-i);
  }
}