Three.js - 广告牌效果,在摄像机平移后保持方向

Lee*_*ski 8 javascript rotation three.js

我有一个始终设置为面向相机的平面几何体:

plane.lookAt(camera.position);
Run Code Online (Sandbox Code Playgroud)

在更新循环中.我OrbitControls用来控制相机.旋转或缩放场景时,平面将继续按预期面向摄像机.

但是,在平移场景后,当飞机继续面向摄像机时,旋转摄像机似乎也会旋转平面,因此,例如,如果平面包含文本,文本可能会显示为旋转或甚至颠倒到观众.

怎么能迫使飞机与相机保持对齐?

jsFiddle的例子:http://jsfiddle.net/Stemkoski/ptVLD/

Wes*_*ley 17

最简单的解决方案是将其添加到动画循环中:

plane.quaternion.copy( camera.quaternion );
Run Code Online (Sandbox Code Playgroud)

更新小提琴:http://jsfiddle.net/ptVLD/15/

或者,您可以使用 THREE.Sprite

编辑:更新为three.js r.67


Lee*_*ski 7

不知何故,只是发布在StackOverflow似乎组织和澄清我的想法:)

一个更好的解决方案(更强大的广告牌)似乎是:

plane.rotation.setFromRotationMatrix( camera.matrix );
Run Code Online (Sandbox Code Playgroud)

问题中的jsFiddle代码链接已相应更新; 然而,现在在平移后旋转相机时,相机/飞机有一些"颤抖",所以我怀疑这个解决方案仍然不理想,我很乐意欣赏并接受一个改进这个问题的答案.