Flowerpod - JS

Did some labs with the HTML canvas drawing API this Sunday. The HTML canvas is great fun. ⚡ Used Tweakpane UI to add in the following tweakable parameters:

• Color filter: colour-dodge, multiply,...

• Color: a few different hex colours that work well.

• Degrees: Density of degrees for plotting a flower petal.

• Amplitude: space between each flower ring (3 rings at the moment).

---

Back to my portfolio build, call this procrastination. But expect I will cleanup some issues with other repos this week, mainly font weight, one nav bar issue.

Demo

👉 Netlify: https://flowerpod.netlify.app/ 🌸

Run Locally

Clone the project

  git clone https://github.com/thorstensson/audio-player-vue-ts.git

The rest is basic, as this project does not run on npm, and the TweakPane module is loaded into plain vanilla JS. I just used VSCode live server on this one.

Roadmap

• Clean up code some, private vars etc.
• Had an idea about this lab, but keeping that one to myself for now as I need to refocus on other stuff.

Contributing

Contributions are always welcome!

License

MIT

More on the Canvas API

• MDN
• HTML5 Canvas by Steve Fulton, Jeff Fulton - O'Reilly