Sofia Syjuco – Project-07

sketch

// Sofia Syjuco
// Section A
// smsyjuco@andrew.cmu.edu
// assignment-07-c

var nPoints = 100; // number of vertices

function setup(){
  createCanvas(400,400); // create a canvas of 400 x 400
  
}

function draw(){
  background(230); // fill background with off-white
  noStroke(); // don't draw the stroke lines

  push();// keep translate info within here
  translate(width/2, height/2); // move to the middle of the screen
  drawCardioid(); // draw the shape
  pop(); // end of translate information section
}

function drawCardioid(){
  //http://mathworld.wolfram.com/Cardioid.html

  var x; // create a variable for x coord
  var y; // create a varaiable for y coord

  // fill with colors dependant on mouse position
  fill(abs(mouseX) % 256, abs(mouseY) % 256, abs(mouseX + mouseY) % 256, 100);

  var a = 80; // size of the shape 

  var mX = constrain(mouseX, 0, width) / 100.0; // variable for using mouseX position
  var mY = constrain(mouseY, 0, height) / 100.0; // variable for using mouseY position

  beginShape(); // begin drawing the shape
  for (var i = 0; i < nPoints; i++){ // draw as many vertices as nPoints states
    var t = map(i, 0, nPoints, 0, TWO_PI); // parameter for function that varies with i

    x = a * (cos(t + mX) * (1-(cos(t + mX)))); // finding the x for the vertex
    y = a * (sin(t + mY) * (1-(cos(t + mY)))); // finding the y for the vertex

    vertex(x,y);// draw a vertex at these points
  }
  endShape(CLOSE); // close the shape
}

To create this shape, I looked through the curve website for an interesting curve, and used it in my code. I played around with seeing what I could effect with mouseX and mouseY, placing them in different areas to experiment and seeing exactly how the shape would change each time. I found this project a really interesting challenge, as we haven’t worked with equations like this before. It was difficult to try and understand just how to implement this in our code, and I found the examples particularly helpful to establish the base of the code- before playing around with different values to make it unique.