Проблема с raycast в Threejs на iOS-устройствах [rev69] - PullRequest
Новая
       5

Проблема с raycast в Threejs на iOS-устройствах [rev69]

0 голосов
/ 19 января 2019

У меня есть маленькая сцена Three.js (сделанная в Blender) с книжной полкой:

http://www.law -trainer.com / JS / Zimmer / hauptdatei / haupt.html

Если дверь щелкнуть, она будет вращаться. Если щелкнуть книгу на полке, она откроется, если щелкнуть правую сторону книги, начнется полет камеры, если щелкнуть книгу влево, она вернется на полку. Видео-холст раскрывается при нажатии и начинает воспроизводить видео (если вы используете Firefox).

Вот моя проблема: на iOS-устройстве такого ответа нет. Как я должен написать событие для iOS, чтобы вызвать raycast? Это код, который сейчас не работает: 

var projector = new THREE.Projector();
function onDocumentMouseDown( event ) {
    event.preventDefault();
    var vector = new THREE.Vector3( ( event.clientX / window.innerWidth ) * 2 - 1, - ( event.clientY / window.innerHeight ) * 2 + 1, 0.5 );

Я провалилась несколько месяцев назад, и это мешает мне продолжать. На андроид-устройствах у меня нет проблем, будь то на планшете или на смартфоне.

Большое спасибо, Ivo

----
Проблема решена с обработчиками событий, как предложено Prisoner 849 и как используется в этом запросе: 40541390 . Смотрите новую версию сцены здесь .

Изменения в коде, которые решили проблему: 

//before init(), in the section of the vars;
var raycaster;
var projector;

//within the body of init():
document.addEventListener('mousedown', onDocumentMouseDown, false);
document.addEventListener('touchstart', onDocumentTouchStart, false);

//outside of init():
function onDocumentTouchStart(event){
  event.preventDefault();
  event.clientX = event.touches[0].clientX;
  event.clientY = event.touches[0].clientY;
  onDocumentMouseDown(event);
}

function onDocumentMouseDown(event){
  projector = new THREE.Projector();
  var vector = new THREE.Vector3( ( event.clientX / window.innerWidth ) * 2 - 1, - ( event.clientY / window.innerHeight ) * 2 + 1, 0.5 );
  projector.unprojectVector(vector,camera);
  raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize() );

  //...managing intersects
  var intersects = raycaster.intersectObjects( collidableMeshList );
  if ( intersects.length > 0 ) {
  //...etc
    }
  event.preventDefault();
}
...