Vine

to generate a new and unique variation

Source Code

Every variart piece is a small program. This is the one that drew what you're looking at.

var background = '#F3EEE3';
var stemColors = ['#A68C69', '#594433'];
var leafColors = ['#9BA657', '#7C8C3F', '#B5BF6E', '#5E6E34'];
var margin = 60;

var vines = intVariable('Vines', 2, 8);
var leafiness = intVariable('Leafiness', 4, 14);

s.rect(0, 0, width, height).attr({fill: background});

// A lens-shaped leaf lying along the x axis from the stem out to its tip,
// then turned to its angle.
function leaf(x, y, size, angle, color){
  var w = size * 0.45;
  s.path('M0,0 C' + size * 0.3 + ',' + -w + ' ' + size * 0.8 + ',' + -w + ' ' + size + ',0' +
         ' C' + size * 0.8 + ',' + w + ' ' + size * 0.3 + ',' + w + ' 0,0')
    .attr({fill: color})
    .transform('t' + x + ',' + y + 'r' + angle + ',0,0');
}

var spacing = (width - margin * 2) / vines;

for (var v = 0; v < vines; v++){
  var baseX = margin + spacing * (v + 0.5);
  var sway = Math.min(spacing / 4, 20);
  var phase = getRandomArbitary(0, Math.PI * 2);
  var waves = getRandomArbitary(1, 2.5);
  var top = getRandomInt(margin, 160);

  function stemX(y){
    return baseX + Math.sin(phase + y / height * Math.PI * 2 * waves) * sway;
  }

  var d = 'M' + stemX(top) + ',' + top;
  for (var y = top; y <= height - margin; y += 10){
    d += ' L' + stemX(y) + ',' + y;
  }
  s.path(d).attr({fill: 'none', stroke: stemColors[v % 2], strokeWidth: 3, strokeLinecap: 'round'});

  // Leaves alternate sides, smaller towards the growing tip at the top.
  var count = Math.round(leafiness * (height - margin - top) / (height - margin * 2));
  var maxSize = Math.min(spacing * 0.55, 60);
  for (var i = 0; i < count; i++){
    var ly = top + 10 + (height - margin - top - 20) * (i + getRandomArbitary(0.2, 0.8)) / count;
    var side = i % 2 == 0 ? -1 : 1;
    var size = maxSize * (0.5 + 0.5 * (ly - top) / (height - margin - top)) * getRandomArbitary(0.8, 1.1);
    var angle = side == 1 ? getRandomInt(-50, -15) : getRandomInt(195, 230);
    leaf(stemX(ly), ly, size, angle, leafColors[getRandomInt(0, leafColors.length - 1)]);
  }
}