# How to make a variable random in p5.js

**URL:** <https://discourse.processing.org/t/how-to-make-a-variable-random-in-p5-js/30892>\
**Category:** Beginners\
**Created:** [June 24, 2021, 6:30pm UTC](https://discourse.processing.org/t/how-to-make-a-variable-random-in-p5-js/30892 "2021-06-24T18:30:59Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![x06](https://avatars.discourse-cdn.com/v4/letter/x/b4bc9f/32.png) [@x06](https://discourse.processing.org/u/x06)\
**Post date:** [June 24, 2021, 6:30pm UTC](https://discourse.processing.org/t/how-to-make-a-variable-random-in-p5-js/30892/1 "2021-06-24T18:30:59Z")

</div>

Hi, I’m playing around with a color wheel by kgrnbrg.

I want to randomize the segmentCount so the color wheel can change shape and thereby adjusting the number of colors available.

I can’t use random in the top and if I place the variable locally and use random() it draws the entire color wheel again and again.

I can’t use noLoop() as I need it to be running for some other purpose later on.

So how can I randomize the segmentCount with the above limitations?

Example:

var segmentCount = 24;  
var radius;  
function setup() {  
createCanvas(windowWidth,windowHeight);  
radius = 300;  
}

function draw() {  
colorMode(HSB, 360,width,height);  
background(‘white’);  
//floor is a fancy way of saying,  
//round downward so that our resulting value is the  
//nearest whole number  
var angleStep = floor(360/segmentCount);  
//there are different drawing modes with beginShape()  
//to learn more, go to: [http://p5js.org/reference/#p5/beginShape](http://p5js.org/reference/#p5/beginShape)  
beginShape(TRIANGLE\_FAN);  
vertex(width/2,height/2);  
for(var angle =0; angle \<= 360; angle += angleStep){  
var vx = width/2 + cos(radians(angle))\* radius;  
var vy = height/2 + sin(radians(angle))\* radius;  
vertex(vx, vy);  
fill(angle, mouseX, mouseY);  
stroke(angle,mouseX,mouseY);  
}  
endShape();  
}

[https://editor.p5js.org/kgrnbrg/sketches/ryhPaDNn](https://editor.p5js.org/kgrnbrg/sketches/ryhPaDNn)

---

<div class="post-metadata">

**Author:** ![debxyz](https://avatars.discourse-cdn.com/v4/letter/d/58956e/32.png) [@debxyz](https://discourse.processing.org/u/debxyz)\
**Post date:** [June 24, 2021, 8:37pm UTC](https://discourse.processing.org/t/how-to-make-a-variable-random-in-p5-js/30892/2 "2021-06-24T20:37:06Z")

</div>

Hello @x06

Since **setup() runs just once** (it is only **draw()** that loops—you can **place random() function in setup**. In this case, make sure to round up using **ceil()**. Then assign that random variable to the segmentCount variable.  
Alternately you can use **randomSeed()** and place that in draw.  
See reference for full explanations on randomSeed() and ceil().

Good luck!  
🤓

BTW, in future posts please format your code. It is difficult to read unformatted… 🙂

---

<div class="post-metadata">

**Author:** ![x06](https://avatars.discourse-cdn.com/v4/letter/x/b4bc9f/32.png) [@x06](https://discourse.processing.org/u/x06)\
**Post date:** [June 25, 2021, 6:59am UTC](https://discourse.processing.org/t/how-to-make-a-variable-random-in-p5-js/30892/3 "2021-06-25T06:59:59Z")

</div>

Thank you so much for helping! Gonna try it out 🙂

And thanks for the heads up on formatting - newbie here - so really appreciate do’s and don’ts

---

<div class="post-metadata">

**Author:** ![x06](https://avatars.discourse-cdn.com/v4/letter/x/b4bc9f/32.png) [@x06](https://discourse.processing.org/u/x06)\
**Post date:** [June 25, 2021, 7:33pm UTC](https://discourse.processing.org/t/how-to-make-a-variable-random-in-p5-js/30892/4 "2021-06-25T19:33:55Z")

</div>

Hmm, can’t make it work. When I declare the SegmentCount in Setup it is no longer a global var and thus, it can’t find it in draw… I kind of know that you assumed that I could get around this problem myself… but I can’t 🙂 Sorry

---

<div class="post-metadata">

**Author:** ![javagar](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/javagar/32/11434_2.png) [@javagar](https://discourse.processing.org/u/javagar)\
**Post date:** [June 25, 2021, 7:46pm UTC](https://discourse.processing.org/t/how-to-make-a-variable-random-in-p5-js/30892/5 "2021-06-25T19:46:14Z")

</div>

> [@x06](#):
>
> When I declare the SegmentCount in Setup it is no longer a global var and thus, it can’t find it in draw…

Prior to `setup()` do this:

```auto
let SegmentCount;

```

That makes the name `SegmentCount` global. Thereafter, you can assign the variable a value wherever else it is necessary. Inside `setup()` or `draw()`, do not begin the assignment statement with `let`, or you will be declaring a local variable with the same name.

---

<div class="post-metadata">

**Author:** ![x06](https://avatars.discourse-cdn.com/v4/letter/x/b4bc9f/32.png) [@x06](https://discourse.processing.org/u/x06)\
**Post date:** [June 25, 2021, 7:53pm UTC](https://discourse.processing.org/t/how-to-make-a-variable-random-in-p5-js/30892/6 "2021-06-25T19:53:39Z")

</div>

> [@javagar](#):
>
> `let SegmentCount;`

Heeeeeyyy that worked! My hero 🙂 Thanks for helping out a newbie - much appreciated