Проблема в следующем:
Чтобы дать поведение, подобное человеческому, , когда точка обзора перемещается, вы должны рассчитать новые позиции на оси x / y / z для объектов (а не только угол поворота в случае вращение, например).
Преобразование CSS должно работать следующим образом, мы даем перспективу , например, 800px для сцены. Тогда объекты будут видны с позицией Z до 800px , если позиция Z, например, 1000px, будет за нашей точкой зрения, поэтому мы не сможем увидеть элемент .
Тем не менее, после поворота вы должны рассчитать новую позицию для предметов на основе нашей новой точки зрения.
Чтобы быть более понятным Я обновил ваш пример с гораздо более простым кодом (он поддерживает только вращение и есть только одно изображение): http://jsfiddle.net/gaAXk/12/
- Перспектива в этом примере: 800px .
- Изображение изначально помещается в x = 0px, y = 0px, z = 0px . Таким образом, он будет виден перед нами на «расстоянии» 800 пикселей.
- Когда мы поворачиваем точку обзора, элемент должен перемещаться по окружности вокруг точки обзора , поэтому положения x, z и угол поворота элемента, нуждается в обновлении.
Элемент в этом примере перемещается по окружности с радиусом 800 пикселей (функция CalculatePos () делает свое дело).
Тот же расчет должен быть обновлен, если мы изменим положение (если точка зрения приближается к некоторым объектам, а дальше от других).
Это не так тривиально. Если у кого-то есть лучшие решения (я не эксперт по 3D), я буду рад их услышать.