How can I plot 4 vertexes using a nested loop?

user_17665563 0
Viewed 26

I'm trying to make a visualizer and I have to draw 4 vertexes while using math to make each vertex so they can react with the music. Rather than just typing all 4 of them out and plotting them I would like to use a nested for loop to do this. I was testing using a regular ellipse with the translate function in p5.js and the translate seems to be translating itself and not just changing the values to how I would want it.

 for (var i = 1; i <= 2; i++) 
    {
        for (var j = 1; j <= 2; j++)
        {
             translate(200 * i,200 * j);
             ellipse(0,0,100)

        }
    }
p5.js nested-loops javascript
1 Answers

translate does not set a translation, but concatenates the current transformation matrix with the new translation. Therefore you need to push the transformation matrix before appending the new translation and pop the matrix after drawing the geometry:

for (var i = 1; i <= 2; i++) {
    for (var j = 1; j <= 2; j++) {
        
        push()
        translate(200 * i, 200 * j)
        ellipse(0, 0, 100)
        pop()
    }
}
user_55777650
Related