Различная обработка рендеринга между нативным и онлайн эскизом - PullRequest
Новая
       43

Различная обработка рендеринга между нативным и онлайн эскизом

3 голосов
/ 30 марта 2019

Я получаю разные результаты при запуске этого образца непосредственно с помощью Processing и с Processing.js в браузере.Почему?

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

/* Program that rotates a triange and draws an ellipse when the third vertex is on top of the screen*/

float y = 3*height/2;
float x = 3*width/2;

float previous_1 = 0.0;
float previous_2 = 0.0;
float current;
float angle = 0.0;


void setup() {
  size(1100, 500);
}

void draw() {

  fill(0, 30);

  // rotate triangle
  angle = angle - 0.02;
  translate(x, y); 
  rotate(angle); 

  // display triangle
  triangle(-50, -50, -30, 30, -90, -60);

  // detect whether third vertex is on top by comparing its 3 successive positions
  current = screenY(-90, -60); // current position of the third vertex

  if (previous_1 < previous_2 && previous_1 < current) {
    // draw ellipse at the extrema position
    fill(128, 9, 9);
    ellipse(-90, -60, 7, 10); 
  }

  // update the 2 previous positions of the third vertex
  previous_2 = previous_1;
  previous_1 = current;
}
  • При обработке эллипс рисуется, когда вершина треугольника находится сверху, и это моя цель.
  • В онлайн-наброскахэллипс рисуется в течение всего времени: /

Ответы [ 2 ]

2 голосов
/ 30 марта 2019

Чтобы получить те же результаты онлайн, что и при локальной обработке, вам нужно будет указать режим рендеринга как 3d при вызове размер

Например: 

void setup() {
  size(1100, 500, P3D);
}

Вам также необходимо указать координату z в вызове screenY()

current = screenY(-90, -60, 0);

С этими двумя изменениями вы получите те же результаты онлайн, что и при локальном запуске.

Онлайн:

Пример эллипса треугольника

Местный:

Triangle Ellipse Exampl

2 голосов
/ 30 марта 2019

Проблема заключается в функции screenY.Распечатайте переменную current в вашем эскизе обработки локально и онлайн.В OpenProcessing переменная current быстро растет более чем в несколько тысяч, в то время как локально она колеблется от 0 до ~ 260.

Похоже, что в OpenProcessing есть ошибка внутри этой функции.

Чтобы исправить этотем не менее, я бы порекомендовал вам зарегистрироваться по-другому, когда вы нарисовали треугольник в верхней части круга, например, с помощью переменной угла: 

// Calculate angle and modulo it by 2 * PI
angle = (angle - 0.02) % (2 * PI);

// If the sketch has made a full revolution
if (previous_1 < previous_2 && previous_1 < angle) {
    // draw ellipse at the extrema position
    fill(128, 9, 9);
    ellipse(-90, -60, 7, 10); 
}

// update the 2 previous angles of the third vertex
previous_2 = previous_1;
previous_1 = angle;

Однако из-за того, как вы рисуете треугольники, эллипснаходится под углом около PI / 3.Чтобы исправить это, можно было бы повернуть экран на angle + PI / 3 следующим образом: 

rotate(angle + PI / 3);

Возможно, вам придется поэкспериментировать со смещением угла немного больше, чтобы идеально нарисовать эллипс в верхней частикруг.

...