Simple Vectors in P5.JS

Jay (Vijayasimha BR)
Random Pink Hula
Published in
2 min readOct 31, 2021
its better in action. source code

I continue my exploration of the nature of code book. I am really digging into this whole generative art vibe with P5.JS.

This time, I am looking into using vectors. My understanding is vectors allow us to define 2 dimensions (and later 3 dimensions, which excites me but also scares me). It makes it easy to add stuff like acceleration, speed and do advance physics. There is a whole bunch of vector functions that can help achieve advanced simulation.

For instance, simulating gravity. The current code creates a gravity that is centered around the location of the mouse. It should not be that hard to put that gravity on entire surface later.

The chapter in the book (link here) goes into a lot of details about physic stuff. I was not able to follow much of it. I never loved theory of things that much but I do eventually learn the theory by experimenting with code and stuff. I will get there after a while, after a lot of experimenting and re-doing.

For instance, here is the code as suggested by the chapter.

chapter source

I was able to take this and get the final image which forms the post image above. As usual, the source code is available on my github page.

Final Note

I still don’t understand everything there is to know about vectors but I will get there. I eventually, almost always, do.

I work as a full time freelance coding tutor. Hire me at UpWork or Fiverr or Stack Overflow. My personal website is here. Find more of my art at Behance and Unsplash.

--

--