Fern

to generate a new and unique variation

Source Code

Every variart piece is open source, you can see exactly how it is drawn from the code.

// adapted from https://raw.githubusercontent.com/odewahn/codebox_recursion_examples/master/plant.pde
var branches = 3;     // Number of branches per line
var depth = 6;        // Recursive depth
var minAngle = 15.0;  // Minimum angle for new branch
var maxAngle = 20.0;  // Maximum angle for new branch
var minLength = 0.30; // Minimum length of new branch, as a pct of current length
var maxLength = 0.80; // Maximum length of new branch, as a pct of current length

var foregroundColor = '#E8F2D8';
var backgroundColor = '#798C32';

function Vector(x, y, r, theta) {
  this.x = x;
  this.y = y;
  this.r = r;
  this.theta = theta;
}

Vector.prototype.getEndPointX = function() {
  return this.x + this.r * Math.cos(this.theta / 57.3);
}

Vector.prototype.getEndPointY = function() {
  return this.y + this.r * Math.sin(this.theta / 57.3);
}

function fractal(v, n) {
  if (n > 0) {
     var dir = 1; // control alternating direction of the branch
     
     s.line(v.x, v.y, v.getEndPointX(), v.getEndPointY()).attr({stroke: foregroundColor});
     
     for (var i = 0; i < branches; i++) {  
        // Create a random vector based on the current one
        var r = new Vector(v.x, v.y, v.r, v.theta);
        r.r = getRandomInt(v.r * minLength, v.r * maxLength); // select a random length
        r.x = r.getEndPointX(); // shift the x-origin
        r.y = r.getEndPointY(); // shift the y-origin
        r.theta += dir * getRandomInt(minAngle, maxAngle); // shift the angle a bit
        dir = dir * -1;  // alternate branch direction
        fractal(r, n - 1); // recurse
      }
   }
}

s.rect(0, 0, width, height).attr({fill: backgroundColor});
var seed = new Vector(0, 0, 225, 45);
fractal(seed, depth);