Rose Curves

As the final work in the project, I was searching for ways to use mathematics in a unique way. I remembered learning about rose curves in my high school calculus class, and knew I had to use it. Here, the program generates 9 flowers with varying sizes and number of petals using the polar coordinates equation.

Every time you refresh the page, you should set a different set of flowers. Have fun!

/* Luna Jerjees
Rose curves using mathematical operations
*/
let roseArray = [];//array of objects

/*
* create canvas and set background
*/
function setup(){
  createCanvas(600,600);
  background('#06305b');//'#A8E6CE');
  let x = 60; //initial x and y position
  let y = 70;
  
  for (let i = 0; i < 9; i++) {
    roseArray[i] = new Roses(i, 100,100,random(40,90), ceil(random(2,15))); //create new instances of the class

     }
  }

function draw(){

  frameRate(15); //reduce framerate
  for (let i = 0; i< roseArray.length;i++){
   roseArray[i].roseShape(); //call to class functions to create roses
 
  }
}
/*
* Rose object class 
* param i: index of the rose object
* param x: x position
* param y: y position 
* param size: size of the rose
* param numPetals: number of petals. If the number is even, 2x will display, if an odd number, that number will be shown
*/

class Roses {
  
  constructor(i, x, y,size, numPetals){
    this.x = x; 
    this.y = y;
    this.size = size;
    this.numPetals = numPetals;
    this.index = i;
  }
  
  roseShape(){
    let colors = ['#DCEDC2','#FFD3B5','#FFAAA6', '#FF8C94','#A8E6CE'];
    let color = random(colors);
    properties(color, color, 0.2);
    //initialize colors from an array of custom colors
 
    // translate position of object to fit canvas size
    if (this.index === 0) {
      translate(this.x,this.y);
    }
    else if (this.index === 1 || this.index === 2){
      translate(0,190);
    }
    else if (this.index === 3) {
      translate(this.x+100, this.y-480);
      //translate(0,-100);
    }
    else if (this.index === 4 || this.index === 5){
      translate(0,190);
    }
    else if (this.index === 6) {
      translate(this.x+100, this.y-480);
    }
    else {
      translate(0,190);
    }
    
    //create the rose 
    beginShape();
    let a = this.size;
    let k = this.numPetals;
    
    // the rose curve uses the following equation,
    // where a is the size and k is the number of petals
    // polar equation = r = a * cos(k*theta)
    // x = r*cos(theta)
    // y = r*sin(theta)
    
  for (var theta = 0; theta < TWO_PI; theta += 0.005) {
    // create the rose all along the circumference until it has 
    // made a 360 degree turn
    let r = a * cos(k * theta);
    let x = r * cos(theta);
    let y = r * sin(theta);
    vertex(x, y);
  }
  endShape();

  }
}

/* Sets properties in color and stroke size when called
*
* param fillCol: the color of the fill of the shape
* param strokeCol: the color of the stroke 
* param strokeWgt: the size of the individual stroke
*/
function properties(fillCol, strokeCol, strokeWgt){
  // if no fill required, leave empty
  if (fillCol === ''){
    noFill();
  }
  if (fillCol) { //otherwise, set the specified color
    fill(fillCol);
  }
   if (strokeCol === ''){ //if the stroke color is left empty, set to white
    stroke(255);
  }
  if (strokeCol) { //otherwise, set given color
    stroke(strokeCol);
  }
  strokeWeight(strokeWgt);
  
}