three.js - ссылка вращения камеры на движение мобильного устройства внутри div

Question

Есть ли способ, чтобы поворот камеры в this demo контролировался движением мобильного устройства, а также движением мыши, как в настоящее время? Это было реализовано для мобильных телефонов here, но не рядом с мышью. Это то, что в настоящее время контролирует вращение камеры для мыши:

function render() { 
     var timer = -0.0002 * Date.now(); 
     camera.position.x += (mouseX - camera.position.x) * .05; 
     camera.position.y += (- mouseY - camera.position.y) * .05; 
     camera.lookAt(scene.position); 
     pointLight.position.x = 1500 * Math.cos(timer); 
     pointLight.position.z = 1500 * Math.sin(timer); 
     renderer.render(scene, camera); 
    } 

Цель состоит в том, чтобы поместить его в DIV на странице, которую можно прокручивать - я видел это реализовано на одной странице полного видового экрана, но не как элемент на более длинной странице

Answer 1

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

, чтобы проверить, если это мобильный телефон:

functionisMobile() { 

    if (navigator.userAgent.match(/Android/i) 
     || navigator.userAgent.match(/webOS/i) 
     || navigator.userAgent.match(/iPhone/i) 
     || navigator.userAgent.match(/iPad/i) 
     || navigator.userAgent.match(/iPod/i) 
     || navigator.userAgent.match(/BlackBerry/i) 
     || navigator.userAgent.match(/Windows Phone/i) 
    ) { 
     return true; 
    } 
    else { 
     return false; 
    } 
}