@@ -166,29 +166,29 @@ The below code is based on the [custom shapes](https://p5js.org/tutorials/custom
166
166
167
167
``` js
168
168
function setup () {
169
- createCanvas (windowWidth, windowHeight);
170
- background (100 );
169
+ createCanvas (windowWidth, windowHeight);
170
+ background (100 );
171
171
}
172
172
function draw () {
173
- translate (width/ 2 , height/ 2 );
174
- // Draw the curved star shape.
175
- beginShape ();
173
+ translate (width/ 2 , height/ 2 );
174
+ // Draw the curved star shape.
175
+ beginShape ();
176
176
177
- // Original anchor at top.
178
- vertex (0 , - 100 );
177
+ // Original anchor at top.
178
+ vertex (0 , - 100 );
179
179
180
- // Top-right curve.
181
- bezierVertex (0 , - 50 , 50 , 0 , 100 , 0 );
180
+ // Top-right curve.
181
+ bezierVertex (0 , - 50 , 50 , 0 , 100 , 0 );
182
182
183
- // Bottom-right curve.
184
- bezierVertex (50 , 0 , 0 , 50 , 0 , 100 );
183
+ // Bottom-right curve.
184
+ bezierVertex (50 , 0 , 0 , 50 , 0 , 100 );
185
185
186
- // Bottom-left curve.
187
- bezierVertex ( 0 , 50 , - 50 , 0 , - 100 , 0 );
186
+ // Bottom-left curve.
187
+ bezierVertex ( 0 , 50 , - 50 , 0 , - 100 , 0 );
188
188
189
- // Top-left curve.
190
- bezierVertex (- 50 , 0 , 0 ,- 50 , 0 ,- 100 );
191
- endShape ();
189
+ // Top-left curve.
190
+ bezierVertex (- 50 , 0 , 0 ,- 50 , 0 ,- 100 );
191
+ endShape ();
192
192
}
193
193
```
194
194
@@ -197,43 +197,43 @@ function draw() {
197
197
198
198
``` js
199
199
function setup () {
200
- createCanvas (windowWidth, windowHeight);
201
- background (100 );
200
+ createCanvas (windowWidth, windowHeight);
201
+ background (100 );
202
202
}
203
203
function draw () {
204
- translate (width/ 2 , height/ 2 );
205
-
206
- // Draw the curved star shape.
207
- beginShape ();
208
-
209
- // Because the order is three, the curves should be
210
- // defined in sets of three after the original anchor
211
- bezierOrder (3 );
212
-
213
- // Original anchor at top.
214
- bezierVertex (0 , - 100 );
215
-
216
- // Top-right curve.
217
- bezierVertex (0 , - 50 );
218
- bezierVertex (50 , 0 );
219
- bezierVertex (100 , 0 );
220
-
221
- // Bottom-right curve.
222
- bezierVertex (50 , 0 );
223
- bezierVertex (0 , 50 );
224
- bezierVertex (0 , 100 );
225
-
226
- // Bottom-left curve.
227
- bezierVertex ( 0 , 50 );
228
- bezierVertex (- 50 , 0 );
229
- bezierVertex (- 100 , 0 );
230
-
231
- // Top-left curve.
232
- bezierVertex (- 50 , 0 );
233
- bezierVertex (0 , - 50 );
234
- bezierVertex (0 ,- 100 );
235
-
236
- endShape ();
204
+ translate (width/ 2 , height/ 2 );
205
+
206
+ // Draw the curved star shape.
207
+ beginShape ();
208
+
209
+ // Because the order is three, the curves should be
210
+ // defined in sets of three after the original anchor
211
+ bezierOrder (3 );
212
+
213
+ // Original anchor at top.
214
+ bezierVertex (0 , - 100 );
215
+
216
+ // Top-right curve.
217
+ bezierVertex (0 , - 50 );
218
+ bezierVertex (50 , 0 );
219
+ bezierVertex (100 , 0 );
220
+
221
+ // Bottom-right curve.
222
+ bezierVertex (50 , 0 );
223
+ bezierVertex (0 , 50 );
224
+ bezierVertex (0 , 100 );
225
+
226
+ // Bottom-left curve.
227
+ bezierVertex ( 0 , 50 );
228
+ bezierVertex (- 50 , 0 );
229
+ bezierVertex (- 100 , 0 );
230
+
231
+ // Top-left curve.
232
+ bezierVertex (- 50 , 0 );
233
+ bezierVertex (0 , - 50 );
234
+ bezierVertex (0 ,- 100 );
235
+
236
+ endShape ();
237
237
}
238
238
```
239
239
0 commit comments