Need help for a homework (should be ez for you )

p5.js Coding Questions
1

So i have to make spawn Random Howls with random abscissa, size, and grey shades.
The problem is that they are spawning and they disappear and i don’t want them to disappear
here’s the code.

function setup(){
    createCanvas(480,120);
}
  function draw(){
     background(204);
   for(var x=random(0,width); x<width; x+=random(0,width))
   {
     var gris=int(random(0,102));
     var echelle=random(0.25,1,0);
     chouette(x,115,gris,echelle);
   }
  }

function chouette(x,y,g,e){
  translate(x,y);
  scale(e);
  stroke(g);
  strokeWeight(70);
  line(0,-35,0,-65);
  noStroke();
  fill(random(0,255));
  ellipse(-17.5,-65,35,35);
  ellipse(17.5,-65,35,35);
  arc(0,-65,70,70,0,PI);
  fill(0);
  ellipse(-14,-65,8,8);
  ellipse(14,-65,8,9);
  quad(0,-58,4,-51,0,-44,-4,-51);
  pop();
  
}

I think u should use array and the function push(); but i don’t really understand how it is working thanks for the answer(s).

2

Hi,

If you don’t want them to disappear, simply delete the background(204); line (and put it inside the setup function).

This way you won’t clear the screen at every loop ad simply keep drawing your howls on top of each others.

Now that said, the following loop looks really weird to me:

for(var x=random(0,width); x<width; x+=random(0,width))

What are you trying to do here ?

3

So first thanks for replying.
I wanted them to spawn without limit but i don’t think it’s what my teachers wanted.
But i found in the orders it was talking about the randomSeed(); and i think this what i need to make this working the way my teachers want.

And for this line i just wanted something to make spawned with no limits howls.

4

I’m sorry I did not understand. Of which limit you are speaking about ?

5

when i talked about limit i was talking about the fact that howls where spawing again and again they never stopped spawning but i think that my teachers just wanted random paterns of howls with the function randomSeed.

6

I don’t think you want to use the randomSeed() function. This function is used only to set the starting point of your random calls so if you launch your program twice with the same seed it will produce the same result even if you have plenty of random calls.

https://p5js.org/reference/#/p5/randomSeed

7

Yeah but if i try somethink like that ;

var r=0;

bla bla

for (bla ,bla,r=r+1){

Don’t u think it’s gonna make news random paterns.

8

I still don’t get what you mean, sorry. I don’t see why you would need that for loop.

Before drawing the owls with all those random variables, start simpler and just draw a circle at a random x position at every frame.

function setup(){
	createCanvas(480,120);
	background(20);
	fill(200);
	frameRate(5);
}

function draw(){
	x = random(width);
	ellipse(x, height / 2, 20, 20);
}

Do you understand this code and how it works ? Can you extend that simple example to your more comple owl problem?

Also it seems that your are french considering the chouette in your code. If that is the case you can maybe try to explain it in french I might understand it better.

9

Désoler pour mon anglais.
Mais c’est demander d’utiliser une loop for donc j’ai essayer de faire un truc pour qu’il spawn au bon endroit (dans le canvas) et donc à l’infini.
Et même si ils mentionnent la fonction randomSeed ce n’est pas marqué de l’utiliser à tt pris n’y de devoir les faire spawn soit à l’infini soit de s’arrêter a partir d’un nombre random donc je pense bidouiller la loop for pour rendre tout ça plus esthétiques mais dût au manque de temps je vais leur rendre ça.
Mais j’ai bien compris le principe de ton animation pour faire spawnner qq chose à des coordonnées aléatoires.
Merci bcp

10

Je n’ai pas bien compris exactement ce que tu voulais faire.
Mais je vais essayer de t’expliquer ce que j’ai pu comprendre comme problème :
ta fonction setup ne s’execute qu’une fois au lancement du programme, alors que la draw s’execute de nouveau en permanence tant que ta page reste ouverte. Donc en mettant ton background(0)dans le draw, tu effaces tout ce que tu as pu y dessiner auparavant.

Une boucle for s’exécute le nombre de fois que tu lui demandes, tant que la condition reste valide :

for (var i =0 ; i < 20; i ++)

par exemple, va executer le contenu de ta boucle for 20 fois (i ++ correspondant à i = i +1) Ce qui est dans les parenthèses, c’est la condition de ta boucle for.

Donc si tu veux afficher plusieurs formes à des positions aléatoires avec des couleurs aléatoires , tu écriras plutôt ça :

for ( var i = 0; i < 50 ; i ++){

// couleurs aléatoires
var rouge= random(255)
var bleu = random(255)
var vert = random(255)

 //coordonées polaires qui seront aléatoires
var x = random(width) // valeur aléatoire entre 0 et width
var y = random(height) // idem pour height

// pour un rectangle de longeur aléatoire entre 0 et 100, et hauteur aléatoire entre 0 et 50
var sizeX = random(100)
var sizeY = random(50)

fill(rouge,vert,bleu)
rect(x,y,sizeX,sizeY)
}

RandomSeed sert à définir une valeur de base pour tes futurs random, de façon à ce que les valeurs renvoyés par un random soient les mêmes entre deux exécutions d’une boucle.
Ainsi, ils ne changeront pas de place à chaque fois. Mais je ne suis pas sûr que ça te soit utile pour ton exercice.