Проблемы с панорамированием и проверкой видимости на переведенном холсте? - PullRequest
Новая
       42

Проблемы с панорамированием и проверкой видимости на переведенном холсте?

0 голосов
/ 11 июня 2019

Так что я работаю над получением 2D масштабирования и панорамирования, работая в проекте p5, а этот пример кода .Я работаю в режиме экземпляра в узле, поэтому моя версия этого перевода / масштаба работает следующим образом: 

p.push();
p.translate(p.width/2, p.height/2);
p.scale(zoom);
p.translate(pan.x/zoom, pan.y/zoom);
// ... some code ...
p.pop();

Я не использовал этот метод раньше, а вместо этого просто панорамировал холст, не переводя его, но я добавляю его сейчас, чтобы можно было также увеличить зум.У меня есть карта на основе плитки, которая больше, чем холст, который я рисовал, начиная с непереведенного (0,0), с размерами холста (700, 500) и картой как (1300, 1300).Поэтому, когда я перевожу в первый раз, я превращаю (0,0) в (350, 250).Если я установлю панорамирование в начале (-350, -250) для компенсации и, по крайней мере, расположу «камеру» над картой, значения, которые я должен использовать, чтобы ограничить способность пользователя панорамировать, действительно странные. 

// in setup()
p.B_CENTER = p5.Vector.mult(dim.view, 0.5);
p.B_PANNING = p5.Vector.mult(p.B_CENTER, -1);
p.B_MAXDIFF = p5.Vector.sub(dim.map, dim.view).add(p.B_CENTER).mult(0.5);

// in mouseDragged()
p.B_PANNING.add(p.createVector(p.mouseX - p.pmouseX, p.mouseY - p.pmouseY));
p.B_PANNING.x = p.round(p.constrain(p.B_PANNING.x, -p.B_MAXDIFF.x, -p.B_CENTER.x/2));
p.B_PANNING.y = p.round(p.constrain(p.B_PANNING.y, -p.B_MAXDIFF.y, -p.B_CENTER.y/2));

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

// effective max panning values
minX = -440 // furthest right,  -maxdiff.x
maxX = -175 // furthest left,   -center.x
minY = -580 // furthest bottom, -maxdiff.y
maxY = -125 // furthest top,    -center.y

// checking for visibility
function __isVisible(pos, bounds) {
    if (pos.x < 0 || pos.y < 0) {
        return false;
    }
    if (pos.x >= bounds.x || pos.y >= bounds.y) {
        return false;
    }
    return true;
}

И на изображении ниже вы можете увидеть, что это делаетв относительное положение (извините за ужасные цвета отладки).Каждая точка на карте показывает свой идентификатор, затем ее фиксированное положение относительно размера карты, затем ее относительное положение с применением панорамирования.Но большинство относительных положений не отражают, где они на самом деле относительно холста.Например, относительное значение x точки # 7 слишком далеко вправо, чтобы быть на 378px, когда ширина холста составляет 700px.

map position example

Итак, мой вопрос (ы):

  1. Что мне нужно сделать, чтобы иметь возможность проверить, видны ли эти точки на холсте?Это важно для приглушения звуков, прикрепленных к точкам, которые выходят за пределы экрана.Прямо сейчас панорамирование делает относительное положение этих точек абсолютно нулевым с этим алгоритмом.
  2. Неужели я неправильно понял, как эта штука перевода / масштабирования / перевода должна работать?
  3. Есть либолее простой способ работы с 2D камерой, чем этот?Есть ли способ контролировать фактическое положение камеры, когда мне нужно перевести ее в центр экрана?Или я должен просто сдаться и использовать объект камеры p5?

Извините, если это сбивает с толку, я ломал голову над его решением и не смог ничего придумать.

...