Неожиданный результат расчета точек эллипса - PullRequest
1 голос
/ 19 января 2020

Я пытаюсь провести линию от центра эллипса до случайной точки границы. По сути, мой код является копией-вставкой некоторого js кода, который я когда-то делал go. Я использовал холст и ваниль js.

Мой код:

var o;
function setup() {
  createCanvas(500, 500);
  o = ellipseGetRandomPoint(250,250,200,300);
}

function draw() {
  background(220);
  stroke("black");
  fill("#333333");
  ellipse(250,250,300,400);

  stroke("red")
  line(250,250,o.pointX, o.pointY);
  console.log(o);
  fill("#999999");
  stroke(0);
  ellipse(250,250,200,300);
}

function ellipseGetRandomPoint(centerX, centerY, radiusX, radiusY) {
    let o = {};
    r = Math.floor(Math.random()*360);
    pointX = centerX + radiusX * Math.cos(r*Math.PI / 180);
    pointY = centerY + radiusY * Math.sin(r*Math.PI / 180);
    o.pointX = Math.floor(pointX);
    o.pointY = Math.floor(pointY);
    o.r = r;
    return o;
}

Проблема в том, что есть некоторая часть линии, которая находится вне эллипса, и я не Я действительно не знаю, почему, потому что параметры c уравнений параболы кажутся нормальными, а также действительно похожая версия этого кода работает над моей другой js программой.

1 Ответ

1 голос
/ 19 января 2020

Третий и четвертый параметры ellipse() - это ширина и высота эллипса, а не полуоси.

Таким образом, параметры для ellipseGetRandomPoint должны быть 150, 200 вместо 200, 300:

o = ellipseGetRandomPoint(250,250,200,300);

o = ellipseGetRandomPoint(250,250,150,200);

См. Пример:

var angle = 0;
function setup() {
    createCanvas(500, 500);
}

function draw() {
    let o = ellipseGetRandomPoint(250,250,150,200);
    angle += 1;

    background(220);
    stroke("black");
    fill("#333333");

    ellipse(250,250,300,400);

    stroke("red")
    line(250,250,o.pointX, o.pointY);
    console.log(o);
    fill("#999999");
    stroke(0);
    ellipse(250,250,200,300);
}

function ellipseGetRandomPoint(centerX, centerY, radiusX, radiusY) {
    let o = {};
    r = Math.floor(Math.random()*360);
    r = angle;
    pointX = centerX + radiusX * Math.cos(r*Math.PI / 180);
    pointY = centerY + radiusY * Math.sin(r*Math.PI / 180);
    o.pointX = Math.floor(pointX);
    o.pointY = Math.floor(pointY);
    o.r = r;
    return o;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.9.0/p5.js"></script>
...