Блог

мой сценарий не работает. Предполагалось, что он будет создавать случайные круги, все они будут касаться нижней части холста, причем их радиус будет уменьшаться с каждым кругом на количество кругов.

Вот код:

 for (var i = 0; i < NUM_CIRCLES; i  ){
   var circle = new Circle(radius);
   circle.setPosition(CENTER_X,CENTER_Y);
   circle.setColor(color);
   add(circle);
    
   radius /= i;
   CENTER_Y = getHeight() - radius;
   color = Randomizer.nextColor();
}
 

Хорошо, вот полный код:

 var NUM_CIRCLES = 30;
var BIG_RADIUS = 180;
var color = Randomizer.nextColor();
var radius = BIG_RADIUS;
var CENTER_X = getWidth() / 2;
var CENTER_Y = getHeight() - radius;

function start(){
    for (var i = 0; i < NUM_CIRCLES; i  ){
        var circle = new Circle(radius);
        circle.setPosition(CENTER_X,CENTER_Y);
        circle.setColor(color);
        add(circle);
    
        radius /= i;
        CENTER_Y = getHeight() - radius;
        color = Randomizer.nextColor();
    }
}
 

насколько я понимаю, вы пытаетесь создавать круги от большего к меньшему, уменьшая их радиус на количество кругов

чтобы достичь этого, сделайте eachReduce = radius / numberofcircles и используйте его в качестве константы eachReduce, чтобы уменьшить каждый круг на это число, чтобы получить больший или меньший размер до нуля, посмотрите на приведенный ниже пример

 let numofcir = 10,
    radius = 80,
    reduceEachBy = radius / numofcir,
    offset = radius / 2

function setup() {
  createCanvas(640, 360);
  noLoop()
}

function draw() {
  background(0)
  stroke(255)
  noFill()

  for(let i=0;i < numofcir;i  ){
    // in p5 ellipse creates circle by x and y radius
    ellipse(offset   (i * offset),150,radius,radius)
    radius -= reduceEachBy
  }
} 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/p5.min.js" integrity="sha512-N4kV7GkNv7QR7RX9YF/olywyIgIwNvfEe2nZtfyj73HdjCUkAfOBDbcuJ/cTaN04JKRnw1YG1wnUyNKMsNgg3g==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>