Как я могу перевернуть VideoTexture Three.js по горизонтали? - PullRequest
Новая
       29

Как я могу перевернуть VideoTexture Three.js по горизонтали?

0 голосов
/ 07 февраля 2019

Мы используем фронтальную камеру в качестве VideoTexture для фона сцены Three.js.Это видео перевернуто по сравнению с тем, как обычно работает фронтальная камера.Есть ли способ перевернуть видео / VideoTexture, чтобы он работал так, как мы ожидаем?

Я пробовал метод, показанный в этом другом вопросе .Это не работает, я думаю, потому что поток видео не имеет силы 2.

Я просмотрел документы Three.js для VideoTexture и Texture но, кажется, есть только способ перевернуть вертикально.Это также упоминалось в предыдущем вопросе , потому что «Нет флага WebGL для gl.UNPACK_FLIP_X_WEBGL ...»

Есть ли способ перевернуть видео по горизонтали?

Ответы [ 2 ]

0 голосов
/ 12 февраля 2019

В дополнение к тому, что предложил @pailhead и поговорив с коллегой, я нашел решение.Единственное, что по предположению - это «14», как показано ниже. 

function scaleBG(workCam, scaleObj) {
  var aspectRatio = window.innerWidth / window.innerHeight;

  var alpha = ((workCam.fov / 2.0) * Math.PI / 180);
  var beta = (90.0 * Math.PI / 180.0); 
  var gamma = ((180.0 - alpha - beta) * Math.PI / 180.0);

  var c = workCam.far - camZOffset - 1.0;
  var a = c * Math.sin(alpha) / Math.sin(gamma);
  var b = c * Math.sin(beta) / Math.sin(gamma);
  var width = a * 2 / (window.innerWidth / 14);

  scaleObj.scale.set(-width, width / aspectRatio, 1);
  scaleObj.position.set(camXOffset,0,-c);
}

Изменение масштаба на «14» выглядит хорошо, но я не уверен, что есть лучший способ рассчитать это значение.Однако на данный момент это работает для меня довольно хорошо.

Edit 1

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

0 голосов
/ 07 февраля 2019

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

...