@@ -323,7 +323,73 @@ Additional shanges to shapes in p5.js 1.x, compared to p5.js 2.0, are as follows
323323* Sampling detail cleanup
324324 * p5.js 1.x has separate ` curveDetail() ` and ` bezierDetail() `
325325 * p5.js 2.0 uses ` curveDetail() ` to cover both, as the more general function
326- * Defauls updated: in p5.js 1.x, ` endContour() ` is the same as ` endContour(CLOSE) `
326+ * Defaults updated: in p5.js 1.x, ` endContour() ` is the same as ` endContour(CLOSE) `
327+
328+ Finally, the behavior of ` endShape ` allows creating different shapes.
329+
330+
331+ <table >
332+ <tr ><th >
333+ p5.js 1.x
334+
335+ ![ image] ( https://github.com/user-attachments/assets/7e476299-8b7a-4852-8922-65a6165ca0e4 )
336+ </th ><th >
337+ p5.js 2.x
338+
339+ ![ image] ( https://github.com/user-attachments/assets/f5db1307-6339-4801-89be-b08c76253acf )
340+
341+ </th ></tr >
342+ <tr ><td >
343+
344+ ``` js
345+ function setup () {
346+ createCanvas (100 , 100 );
347+ background (200 );
348+ beginShape ();
349+
350+ // Add the first control point.
351+ curveVertex (32 , 91 );
352+ curveVertex (32 , 91 );
353+
354+ // Add the anchor points.
355+ curveVertex (21 , 17 );
356+ curveVertex (68 , 19 );
357+
358+ // Add the second control point.
359+ curveVertex (84 , 91 );
360+ curveVertex (84 , 91 );
361+
362+ // Stop drawing the shape.
363+ endShape (CLOSE );
364+ }
365+ ```
366+ </td ><td >
367+
368+
369+ ``` js
370+ function setup () {
371+ createCanvas (100 , 100 );
372+ background (200 );
373+ beginShape ();
374+
375+ // Control points not needed
376+ // if the goal is a smooth close
377+ // curveVertex(32, 91);
378+ curveVertex (32 , 91 );
379+
380+ // Add the anchor points.
381+ curveVertex (21 , 17 );
382+ curveVertex (68 , 19 );
383+
384+ // Second control point also excluded
385+ // curveVertex(82, 91);
386+ curveVertex (82 , 91 );
387+ endShape (CLOSE );
388+ }
389+ ```
390+
391+ </td ></tr >
392+ </table >
327393
328394All of the above usages in p5.js 1.x remain available with the [ shapes.js] ( https://github.com/processing/p5.js-compatibility/blob/main/src/shapes.js ) compatibility add-on library.
329395
0 commit comments