Project 7: Composition with curves

``````// Yash Mittal
// Section D

nPoints = 100;

function setup() {
createCanvas(480, 480);
frameRate (7);
}

function drawLemniscateCurve () { // coding the curve

var x;
var y;

var a = 180;
var h = mouseX; // X axis interaction
var w = map (mouseY, 0, 480, 0, 240) // Y axis interaction

stroke (205, 0, 11);
strokeWeight (5);
fill (255);

beginShape ();

for (var i = 0; i < nPoints; i = i + 1) {

var t = map (i, 0, nPoints, 0, TWO_PI);

x = (a * cos (t + w)) / (1 + pow(sin (t), 2)); // iterating x
y = (a * sin (t + h)) * (cos (t)) / (1 + pow(sin (t), 2)); // iterating y

vertex (x + w / 3, y + h / 3);
}

endShape (CLOSE);
}

function draw() {

background (0);

push ();
translate (width / 2, height / 2);
drawLemniscateCurve ();

}

``````

After I chose my curve, I realized that it somewhat looks like Spiderman’s eyes from into the spider-verse and I wanted to experiment more with that so I tried to iterate different eyes based on the X and Y location of the mouse. I struggled with drawing the curve at first but once I understood the concept, iterating became pretty easy.