How to write a condition to generate points inside an ellipse in canvas?

M

Michael9002019-10-12 14:48:09

JavaScript

Michael900, 2019-10-12 14:48:09

How to write a condition so that the points are generated inside the ellipse and?

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<canvas style="border: 1px solid grey" id="canvas"></canvas>
</body>
</html>

const WIDTH = 300;
const HEIGHT = 300;
const canvas = document.getElementById('canvas');
canvas.width = WIDTH;
canvas.height = HEIGHT;

const ctx = canvas.getContext('2d');

const n = 10;


function getRandom(min, max) {
    return Math.floor(Math.random() * (max - min)) + min;
}

ctx.beginPath();
ctx.ellipse(100, 100, 50, 90, Math.PI / 2, 0, 2 * Math.PI);
ctx.stroke();


for (let i = 0; i < n; i++){
   let x = getRandom(50,150);
   let y = getRandom(50,150);
   ctx.rect(x, y, 2,2);
   ctx.stroke();
}

Reply

Answer the question

In order to leave comments, you need to log in

1 answer(s)

0

0xD34F, 2019-10-12
@Mihail900

One coordinate was generated, restrictions for the second were found through the ellipse equation, and the second was generated.
https://jsfiddle.net/rLcuy4ko/