javascript - 当绘制它们的循环结束时如何为圆圈设置动画p5.js

您需要为要绘制的每个圆圈创建一个点对象。数组非常适合存储这样的东西。
然后，每个绘制循环都必须增加每个点，并重新绘制每个圆。

让我们逐步检查您的代码：（
为简化起见，我假设您正在绘制 2 个圆圈而不是 36 个圆圈。）

spot从 x = 50 和 y = 50 的单个数据对象开始。

spot在的坐标 (50, 50)处画一个圆圈。那个圈子就在那里。
然后随机化中的值spot，所以现在它可能是 x = 231.3，y = 4.2，并在这些坐标处绘制一个新圆。那个圆圈已经画在那里，并将留在那里。

现在你取spot，它仍然只是一个带有随机坐标的单个数据对象，然后你增加 x。spot.x变成 232.3, 233.3, 234.3... 但你永远不会调用代码来重新绘制圆圈。

即使您确实在的新坐标处再次绘制了一个圆spot，它也不会影响您在 50、50 处的原始圆。

（如果你将这一行添加console.log(spot);到你的draw()函数中，你会明白我的意思。）