function setup() {
createCanvas(400, 400);
noLoop();
}
function draw() {
background(220);
translate(width / 2, height / 2)
let amount = 12;
for (let a = 0; a < amount; a += (360 / amount)) {
xm = cos(a) * 100;
ym = sin(a) * 100;
strokeWeight(4);
fill(255);
ellipse(xm, ym, 10);
console.log(a)
}
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/p5.js"></script>
I try to make 12 points on a circle ( This will be a watch face). I don't know why this is not working please help me.
You need to add angleMode(DEGREES) so you can use degrees instead of radians (more info here: https://p5js.org/reference/#/p5/angleMode)
Also you want to go from 0 to 360 instead of to 12 (amount) I created a var to hold the 360 to avoid confusion. There you go!
function setup() {
createCanvas(400, 400);
angleMode(DEGREES);
noLoop();
}
function draw() {
let totalCircle = 360;
background(220);
translate(width / 2, height / 2)
let amount = 12;
for (let a = 0; a < totalCircle; a += (totalCircle / amount)) {
xm = cos(a) * 100;
ym = sin(a) * 100;
strokeWeight(4);
fill(255);
ellipse(xm, ym, 10);
console.log(a)
}
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/p5.js"></script>