D3 Examples - Skewed Phyllotaxis Pattern (SVG)

xxxxxxxxxx
 
<!doctype html>
<html>
<head>
  <title>Phyllotaxis</title>
</head>
<body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.2/p5.js"></script>
​
<script>
​
var w = 500, h = 500;
​
var cx = w/2;
var cy = h/2;
​
var circles = 1500;
var golden_ratio = (Math.sqrt(5)+1)/2 - 1;
var golden_angle = golden_ratio * (2* Math.PI);
var circle_rad = (w * .5)-10;
​
function setup(){
  createCanvas(w,h);
}
​
function draw(){
  background(255);
  for (var i = 1; i <= circles; ++i) {
      var dot_rad = .006 * i;
      var ratio = i / circles;
      var angle = i * golden_angle;
      var spiral_rad = ratio * circle_rad;
      var x = cx + cos(angle) * spiral_rad;
      var y = cy + sin(angle) * spiral_rad*.5;
      ellipse(x, y, 4);
      noStroke();
            fill('#4ba41a');
    }
}
​
</script>
</body>
</html>
​
    