dnam-project11

sketch

var circPositions = [33, 66, 132, 198, 264, 330]; //5 dots in the middle

function setup() {
  createCanvas(400, 400);
  background(0);
  frameRate(10); //reduce lag, choose frequency of updates
}

function draw() {
  fill(mouseX, mouseY, mouseY) //color interacts with mouse position
  for(var i = 1; i < 6; i++) { //create the dots
    ellipse(circPositions[i], 200, 10, 10);
  }
  for(var b = 1; b < 100; b++){ //create turtle lines / marks with loop
    var turtle = makeTurtle(circPositions[b], random(0, 400)); //set variable for turtle
     turtle.penDown();
     turtle.setColor(mouseX); //shade depending on the mouse position
     turtle.setWeight(0.1 * mouseY / 10); //changes weight depending on mouse position
     turtle.right(random(1, 360)); //mark changes depending on a random factor
     turtle.forward(3); //small mark
     
  if (mouseIsPressed === true) { //when mouse is pressed, make large web like lines
  makeTurtle(circPositions[b], 100);
  turtle.penUp();
  turtle.right(90);
  turtle.setWeight(1);
  turtle.penDown();
  turtle.forward(100);
}
     
  if (keyIsPressed === true){ //clear and reset canvas
       background(0);
}
}




// turtle graphics ----------------------------------------------
function turtleLeft(d){this.angle-=d;}function turtleRight(d){this.angle+=d;}
function turtleForward(p){var rad=radians(this.angle);var newx=this.x+cos(rad)*p;
var newy=this.y+sin(rad)*p;this.goto(newx,newy);}function turtleBack(p){
this.forward(-p);}function turtlePenDown(){this.penIsDown=true;}
function turtlePenUp(){this.penIsDown = false;}function turtleGoTo(x,y){
if(this.penIsDown){stroke(this.color);strokeWeight(this.weight);
line(this.x,this.y,x,y);}this.x = x;this.y = y;}function turtleDistTo(x,y){
return sqrt(sq(this.x-x)+sq(this.y-y));}function turtleAngleTo(x,y){
var absAngle=degrees(atan2(y-this.y,x-this.x));
var angle=((absAngle-this.angle)+360)%360.0;return angle;}
function turtleTurnToward(x,y,d){var angle = this.angleTo(x,y);if(angle< 180){
this.angle+=d;}else{this.angle-=d;}}function turtleSetColor(c){this.color=c;}
function turtleSetWeight(w){this.weight=w;}function turtleFace(angle){
this.angle = angle;}function makeTurtle(tx,ty){var turtle={x:tx,y:ty,
angle:0.0,penIsDown:true,color:color(128),weight:1,left:turtleLeft,
right:turtleRight,forward:turtleForward, back:turtleBack,penDown:turtlePenDown,
penUp:turtlePenUp,goto:turtleGoTo, angleto:turtleAngleTo,
turnToward:turtleTurnToward,distanceTo:turtleDistTo, angleTo:turtleAngleTo,
setColor:turtleSetColor, setWeight:turtleSetWeight,face:turtleFace};
return turtle;}}

I wanted to create something like a spider web using the turtle tool we were given. I allowed for two different types of art to be created. The results differ depending on the user and their mouse movements.

First option of only letting the small marks to be developed

Creating spider web with mouse positions

Leave a Reply