How to Find the XY Coordinates on a Circle in JavaScript

08/01/2021

Contents

In this article, you will learn how to find the XY coordinates on a circle in JavaScript.

Finding the XY coordinates on a circle in JavaScript

When working with circles, it’s often necessary to find the coordinates of a point on the circumference of the circle. In JavaScript, we can use the sine and cosine functions to find the XY coordinates on a circle.

To find the XY coordinates on a circle, we need to know the center of the circle, the radius of the circle, and the angle of the point we want to find. The angle is measured in radians, so we may need to convert from degrees to radians first.

The formula for finding the XY coordinates on a circle is:

x = cx + r * cos(a)
y = cy + r * sin(a)

where cx and cy are the coordinates of the center of the circle, r is the radius of the circle, a is the angle of the point we want to find in radians, cos is the cosine function, and sin is the sine function.

Examples

Find the XY coordinates of a point on a circle with center (0,0) and radius 50 at an angle of 0 degrees

const cx = 0;
const cy = 0;
const r = 50;
const angleDegrees = 0;
const angleRadians = angleDegrees * Math.PI / 180;
const x = cx + r * Math.cos(angleRadians);
const y = cy + r * Math.sin(angleRadians);
console.log(x, y); // 50, 0

In this example, we first define the center of the circle cx and cy to be (0,0) and the radius r to be 50. We then define the angle of the point we want to find to be 0 degrees and convert it to radians using the formula angleRadians = angleDegrees * Math.PI / 180. We then use the formula to find the XY coordinates of the point and store the values in the variables x and y. The output is the values of x and y, which are approximately equal to 50 and 0, respectively.

Find the XY coordinates of a point on a circle with center (-25,30) and radius 10 at an angle of 45 degrees

const cx = -25;
const cy = 30;
const r = 10;
const angleDegrees = 45;
const angleRadians = angleDegrees * Math.PI / 180;
const x = cx + r * Math.cos(angleRadians);
const y = cy + r * Math.sin(angleRadians);
console.log(x, y); // -19.14213562373095, 38.53553390593274

In this example, we define the center of the circle cx and cy to be (-25,30) and the radius r to be 10. We then define the angle of the point we want to find to be 45 degrees and convert it to radians using the formula angleRadians = angleDegrees * Math.PI / 180. We then use the formula to find the XY coordinates of the point and store the values in the variables x and y. The output is the values of x and y, which are approximately equal to -19.14 and 38.54, respectively.