How can I generate random points on a circles circumference in javascript

Question

I am trying to write a function that will randomly return an (x,y) co-ordinates around a given circumference so if I have a point that's at (0,0) (being the center of the div) how can I write a function that randomly places other entities that appear among the outer edge of a circle.

All I need is the equation i know it has something to do with getting the distance from the center to the circumference edge just no idea how to calculate it and randomize it so it looks good.

this inst homework its more of im tired of googleing for only part of the equation and having to figure it out by trial and error. — Mouseroot, Mar 26 '12 at 20:49

score 122 · Accepted Answer · edited Jul 01 '14 at 13:50

122

Just get a random angle:

var angle = Math.random()*Math.PI*2;

Then

x = Math.cos(angle)*radius;
y = Math.sin(angle)*radius;

Done.

edited Jul 01 '14 at 13:50

Mehraban

3,164
4
37
60

answered Mar 26 '12 at 20:26

Niet the Dark Absol

320,036
81
464
592

1

yea this works exactly how I wanted it to and even breaks it down for me :D – Mouseroot Mar 26 '12 at 20:47
What kind of value is the angle? Is it radians? – knownasilya May 10 '17 at 03:17
@knownasilya Yup, because `sin` and `cos` accept radians only. – Niet the Dark Absol May 10 '17 at 08:47
Any tips for outputting only certain degrees of the circle? – knownasilya May 10 '17 at 16:10
1

`var angle = (Math.random()*(maxAngleDegrees-minAngleDegrees)+minAngleDegrees)/180*Math.PI;` - something like that. – Niet the Dark Absol May 10 '17 at 17:17
1

@Srba My code uniformly distributes points on a circle's circumference. Yours appears to distribute points on a disc's area. – Niet the Dark Absol Sep 11 '19 at 14:01
Any easy way to do this in higher dimensions than 2? – Vivek Subramanian Sep 20 '19 at 20:35
1

@VivekSubramanian You'll need two angles. Essentially the point starts at `(1,0,0)` and you then rotate it around the Z axis by the first angle (that's what this answer does), then rotate it around the Y axis (you'll need some more trigonometry) – Niet the Dark Absol Sep 20 '19 at 22:39

score 1 · Answer 2 · answered Aug 06 '22 at 19:54

1

You can also avoid computing sin and cos via this formula:

// Generate 2 random numbers in the [-1, 1] interval
const u = Math.random()*2 - 1;
const v = Math.random()*2 - 1;

const u2 = u*u;
const v2 = v*v;
const r = u2 + v2;

if (r <= 1) {
  x = (u2 - v2)/r;
  y = (2*u*v)/r;
}

if r > 1 you need to re-try, but the expected number of tries until you get a valid point is ~1.27. So this algorithm is very efficient and avoids the complex trigonometric functions.

Visualization: https://observablehq.com/@kunigami/circles-and-randomness

answered Aug 06 '22 at 19:54

kunigami

3,046
4
26
42

1

Interesting solution. As an aside, note that efficiency through avoidance of trigonometric functions is likely a matter of architecture. Nearly all modern VLSI processors contain a Floating Point Unit (FPU) incorporating transcendental functions, making this algorithm very likely less performant as compared to the selected answer. On the other hand, if using a processor without a FPU (eg, the Arduino architecture) this algorithm might be more efficient than using libraries that compute Cos and Sin... Empirical testing of course will need to vet this... – Trentium Aug 21 '22 at 15:40

How can I generate random points on a circles circumference in javascript

2 Answers2