一个for循环来重复同心椭圆

时间:2016-10-31 03:43:06

标签: javascript processing

我正在努力弄清楚如何重复这两个同心椭圆。方向是1)它将绘制一个随机数的图像(这是我所在的部分)和2)使用嵌套的for循环,使得填充在外部循环中,绘图在内部循环中。使用适当的值。这是原始代码:

noStroke();



for(var total = 25; total > 0; total--){

    fill(random(0,255),random(0,255), random(0,255));

    ellipse(200, 200, total * 10, total * 20);

    ellipse(200, 200, total * 20, total * 10);

}

这就是我所拥有的,正如你所看到的,我让他们重复,但他们必须保持他们的同心细节。让他们保持同心细节是我在过去几天里遇到的问题。 (通过同心细节我的意思是彩虹效果)

noStroke();

var flower = function(x,y){ 

for(var total = 5; total > 0; total--){

    fill(random(0,255),random(0,255), random(0,255));



    for(var i = 0; i < random(1,20); i++) {
    var circleX = random(x,y);
    var circleY = random(x,y);   
    ellipse(circleX, circleY, total * 10, total * 20);
    ellipse(circleX, circleY, total * 20, total * 10);

}
}
};
flower(0, 400);

1 个答案:

答案 0 :(得分:0)

您使用的是Processing.js还是p5.js?如果我们能够真正运行您的计划,您将获得更好的帮助,因此请尝试发布MCVE而不是断开连接的代码段。

如果您发布一个您希望此代码执行的模型与它实际执行的操作的模型,也可能会有所帮助。但是我想我理解你的目标:你想通过绘制同心圆来绘制花朵,并且#34;堆叠&#34;创建轮廓效果,并且您希望随机执行此操作。

有几件事突然袭来我:

考虑您的循环所在的顺序。在第一段代码中,您可以通过将total25循环到0来绘制一朵花,这样就可以了。现在你想随机多次这样做。这意味着你希望total循环循环中重复随机数次!但是你已经改变了这一点,并将你的随机循环放在total循环中。

这就是说明处理:对于total 5次,在随机位置绘制一个随机数量的圆圈。

相反,您要做的是:对于随机数次,绘制total5个圆圈。您还需要检查生成circleXcircleY的位置。现在,每个圆圈都是在一个随机位置绘制的,当你真正想要为构成同一朵花的每个圆圈使用相同的circleXcircleY时。换句话说,你想在内循环之前生成这些变量。