processing/p5.js★ 23,941

Add shader examples to trigonometric functions

Mergedopened · merged · #8801

About processing/p5.js

p5.js is a client-side JS platform that empowers artists, designers, students, and anyone to learn to code and express themselves creatively on the web. It is based on the core principles of Processing. Looking for p5.js 2.0? http://beta.p5js.org

  • art
  • creative-coding
  • design
  • education
  • graphics
  • html
  • javascript
  • learning

The change

Resolves #8777 Changes: Adds inline p5.strands examples to the reference documentation for 8 trigonometry functions in src/math/trigonometry.js: • sin() — sine-driven color oscillation • cos() — cosine-driven color oscillation • tan() — rapid tangent-based color transitions • asin() — smooth color transition via asin(sin(t)) • acos() — pulsing color transition via acos(cos(t)) • atan() — sawtooth color effect via atan(tan(t)) • degrees() — convert radians to degrees in shader • radians() — convert degrees to radians in shader Each example uses buildColorShader() with finalColor.begin()/end() and includes a brief explanation that the function can be used in shaders with p5.strands. Screenshots of the change: <!-- If applicable, add screenshots depicting the changes. --> Documentation-only change PR Checklist <!-- To check any option, replace the "○" with a "✓". Be sure to check out how it looks in the Preview tab! Feel free to remove any portion of the template that is not relevant for your issue. --> • ✓ npm run lint passes • ✓ [Inline reference] is included / updated • ○ [Unit tests] are included / updated [Inline reference]: https://p5js.org/contribute/contributing_to_the_p5js_reference/ [Unit tests]: https://github.com/processing/p5.js/tree/main/contributor_docs#unit-tests

Referenced issues