-
Notifications
You must be signed in to change notification settings - Fork 91
/
sketch.js
100 lines (71 loc) · 2.09 KB
/
sketch.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
////////////////////////////////////////////////////////////////////////////////
// //
// P5.GUI : Slider-Range Example 3 //
// //
////////////////////////////////////////////////////////////////////////////////
// This example shows how to use *addObject* instead of *addGlobals*
// to provide gui parameters via a javascript object
let params = {
// seeds
seeds: 500,
seedsMin: 1,
seedsMax: 2000,
// angle (phi)
angle: 360 * (Math.sqrt(5)-1) / 2,
angleMax: 360,
angleStep: 0.1,
// radius of the seed
radius: 3,
radiusMin: 0.5,
radiusMax: 5,
radiusStep: 0.1,
seedColor: '#ff00dd',
// scale
zoom: 15,
zoomMax: 50,
zoomStep: 0.1,
opacity: 150,
opacityMax: 255,
bgColor: [0, 0, 0]
};
////////////////////////////////////////////////////////////////////////////////
// the gui object
let gui;
function setup() {
// all angles in degrees (0 .. 360)
angleMode(DEGREES);
// create a canvas that fills the window
createCanvas(windowWidth, windowHeight);
// create the GUI from a settings object
gui = createGui('slider-range-1');
gui.addObject(params);
// only call draw when then gui is changed
noLoop();
}
function draw() {
// hello darkness my old friend
background(params.bgColor);
// let the seeds be filleth
let c = color(params.seedColor);
fill(red(c), green(c), blue(c), params.opacity);
stroke(0, params.opacity);
// absolute radius
let r = params.radius * params.zoom;
push();
// go to the center of the sunflower
translate(width/2, height/2);
// rotate around the center while going outwards
for(let i = 0; i < params.seeds; i++) {
push();
rotate(i * params.angle);
// distance to the center of the sunflower
let d = sqrt(i + 0.5) * params.zoom;
ellipse(d, 0, r, r);
pop();
}
pop();
}
// dynamically adjust the canvas to the window
function windowResized() {
resizeCanvas(windowWidth, windowHeight);
}