如何使用嵌套循环绘制 4 个顶点？

Question

我正在尝试制作一个可视化工具，我必须绘制 4 个顶点，同时使用数学来制作每个顶点，以便它们可以与音乐做出反应。我不想将所有 4 个都键入并绘制出来，而是想使用嵌套的 for 循环来执行此操作。我在 p5.js 中使用带有翻译功能的常规椭圆进行测试，翻译似乎是在翻译自己，而不仅仅是将值更改为我想要的方式。

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

        }
    }

Answer 1

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绘制几何后的矩阵：

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()
    }
}

如何使用嵌套循环绘制 4 个顶点？

How can I plot 4 vertexes using a nested loop?

javascript

nested-loops

p5.js