Возникли проблемы при вращении каждого отдельного элемента в двойной цикл с обработкой

Поэтому, если вы запустите этот эскиз, вы увидите сетку со знаком плюс. Я хочу вращать каждого человека, но я не могу понять это. Я пытался перевести, pushMatrix/popMatrix. Но возможно это не в правильном месте. Я удалил его сейчас, может быть, кто-то может указать, как вращать каждый знак плюс вокруг своей оси.

int rib;
void setup() {
  size(1200, 800);
  rib = 7;
}


void draw() {
  background(0);
  for (int i = -100; i < width+100; i = i + rib * 10) {
    for (int j = -100; j < height+100; j = j + rib * 10) {
      noStroke();
      fill(255);

      plus(i, j);
      plus(3*rib+i, 1*rib+j);
      plus(6*rib+i, 2*rib+j);
      plus(9*rib+i, 3*rib+j);
      plus(2*rib+i, 4*rib+j);
      plus(5*rib+i, 5*rib+j);
      plus(8*rib+i, 6*rib+j);
      plus(1*rib+i, 7*rib+j);
      plus(4*rib+i, 8*rib+j);
      plus(7*rib+i, 9*rib+j);
    }
  }
}

void plus(int x, int y) {
  pushMatrix();
  beginShape();
  vertex(x+0, y+0);
  vertex(x+0, y+-rib);
  vertex(x+rib, y+-rib);
  vertex(x+rib, y+0);
  vertex(x+2*rib, y+0);
  vertex(x+2*rib, y+rib);
  vertex(x+rib, y+rib);
  vertex(x+rib, y+2*rib);
  vertex(x+0, y+2*rib);
  vertex(x+0, y+rib);
  vertex(x+-rib, y+rib);
  vertex(x+-rib, y+0);
  endShape(CLOSE);
  popMatrix();
}
Источник

2 ответа

Шаг 1: Используйте pushMatrix() сохранить состояние текущей матрицы.

Вы должны сделать это, потому что вы не хотите, чтобы вращение накапливалось. Если вы поворачиваете одну фигуру на 30 градусов, а другую на 45 градусов, вам не нужно поворачивать вторую фигуру (30+45) градусов.

Вот ссылка на pushMatrix(),

Шаг 2: Используйте translate() переместить свою форму, где это должно быть.

Убедитесь, что вы рисуете свою фигуру с этой координатой в качестве источника! Прямо сейчас вы рисуете фигуры с x,y в качестве источника, когда вам нужно использовать 0,0 в качестве источника после перевода.

Вот ссылка на translate(),

Шаг 3: Используйте rotate() повернуть свою форму вокруг начала координат.

Помните, что вы теперь "переместили" 0,0 на х, у вы прошли в translate() функция!

Шаг 4: Нарисуйте свою форму.

Опять же, не забудьте использовать 0,0 в качестве источника, а не х, у.

Вот ссылка на rotate(),

Шаг 5: Звоните popMatrix() восстановить матрицу, которую вы имели, когда вызывали `pushMatrix()'.

Это восстанавливает вращение и перевод обратно в нормальное состояние, поэтому следующий перевод и вращения не накапливаются.

Вот ссылка на popMatrix(),

Шаг 6: Повторите.

Поместите все вышеперечисленное в функцию, а затем вызовите ее из цикла for, чтобы нарисовать более одной фигуры.

Вот упрощенные примеры, которые рисуют прямоугольники:

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

void draw() {
  background(0);

  noStroke();
  fill(255);

  plus(100, 100);
  plus(200, 200);
}

void plus(float x, float y) {
  pushMatrix();
  translate(x, y);
  rotate(mouseX);
  rect(-20, -40, 40, 80);
  popMatrix();
}
Источник

Ось вращения всегда находится в начале координат (0,0). Таким образом, мы должны перевести начало координат туда, где мы хотим, чтобы ось вращения была. В вашем случае нарисуйте плюс с центром в (0,0) и используйте translate, чтобы переместить его в нужное положение. Я сделал этот пример, используя более простой квадрат, но идея та же. (У меня нет времени здесь:) Посмотрите, может ли это помочь вам.

void setup() {
  size(1200, 800);
  noStroke();
  fill(255);
}


void draw() {
  background(0);
  float a  = map(mouseY, 0, height, 30, 270);
  for (int i = -100; i < width+100; i+=40) {
    for (int j = -100; j < height+100; j+=40) {

      plus(i, j, a);
    }
  }
}

void plus(int x, int y, float a) {

  pushMatrix();
  translate(x, y);
  rotate(radians(a));
  beginShape();
  vertex(-10, -10);
  vertex(10, -10);
  vertex(10, 10);
  vertex(-10, 10);
  endShape(CLOSE);
  popMatrix();
}

Вам могут понравиться эти уроки:

http://processing.org/tutorials/transform2d/

https://processing.org/tutorials/pshape/

Источник
Другие вопросы по тегам