Three.js поворачивает камеру в определенное положение

Question

У меня есть сфера с divs с помощью CSS3DRenderer. Когда я нажимаю на один из div, я бы хотел поместить/повернуть камеру, чтобы элемент отображался в центре экрана. Я пробовал несколько примеров, и я читал другие ответы, но все же я не могу заставить его работать.

На данный момент он перемещает камеру, но сфера получает приложена в разных местах

То, что я пытаюсь сделать, это следующее:

Получает класс элемента HTML в. Затем проведите через массив THREE.CSS3DObject, чтобы получить его положение, а затем используйте это, чтобы поместить камеру.

function moveCamera(element) { 

for (var i = 0; i < objects.length; i ++) { 

    var object = objects[ i ]; 

    if(object.element.className == element.className) { 

     position = object.position; 
     rotation = object.rotation; 
     found = true; 
     break; 
    } 

} 

if (found) { 

    camera.rotation = rotation; 
    render(); 
    found = false; 

} } 

Что я делаю неправильно?

Вот пример http://jsfiddle.net/37R22/1/

Благодаря

Answer 1

Вы были близки. Вам просто нужно переместить камеру в нужное место.

camera.rotation.copy(rotation); 
camera.position.copy(position).multiplyScalar(4); 

Обновлено фидель: http://jsfiddle.net/37R22/2/ или http://jsfiddle.net/37R22/3/

Будьте осторожны о поездке за-спину TrackballControls и изменение свойств камеры самостоятельно. Однако это работает.

three.js r.65