Skip to content

Instantly share code, notes, and snippets.

@jhubley
Last active June 29, 2016 20:57
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jhubley/48406982f6988b626d9527d75a98b062 to your computer and use it in GitHub Desktop.
Save jhubley/48406982f6988b626d9527d75a98b062 to your computer and use it in GitHub Desktop.
Phyllotaxis in p5.js
<!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)-20;
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;
ellipse(x, y, dot_rad);
noStroke();
if (i < 800){fill('#a6cf02');}
else if (i < 1300){fill('#4ba41a');}
else {fill('#229946');}
}
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment