Why do I have bigger circles in the bottom right

Question

Hi everyone !

I've been working on a little project to make an hyperspace animation on web :
https://code.sololearn.com/W2WT5FBhcA61

My problem with my app is that I have more bigger stars on the Bottom right, but I don't know why. My programm seems to spawns stars symetrically with same properties.
Can someone help me find out where the problem is ?

Answer 1

Hey Romain! It seems like you've missed the center of the frame while calculating the distance here,

//distance from the center
d = Math.sqrt(curX*curX + curY*curY);

Also, can you explain me why did you chose "50" as a value? Is there some kind of logic I'm missing?

//move star toward the edge
curX += speed*(curX-50)/d;
curY += speed*(curY-50)/d;

Answer 2

Thanks for your answer. Indeed I forgot that cx and cy attributes where from top-left corner and not center. That explains why circles grow bigger on the bottom-left.
The 50 in my code is because I made coordonates in % so 50% is half the screen. But I should change it to get the coordinates of the spawner instead. And reverse it to have it increase speed the further from the center instead of decreasing as it does with old code.

Answer 3

I don't know what you're talking about, but amazing code lol