2013-11-01 55 views
8

我有一個平面幾何總是被設置通過面對鏡頭:three.js所 - 廣告牌的效果,保持攝像機平移後方向

plane.lookAt(camera.position); 

在更新循環。我正在使用OrbitControls來控制相機。當旋轉或縮放場景時,飛機繼續按照預期面對相機。

但是,在平移場景後,當飛機繼續面向相機時,旋轉相機似乎也旋轉平面,以便例如如果飛機要包含文本,文本可能會出現旋轉或甚至顛倒的觀衆。

飛機如何被迫保持與相機對齊?

例在的jsfiddle:http://jsfiddle.net/Stemkoski/ptVLD/

回答

15

最簡單的方法是簡單地添加到您的動畫循環:

plane.quaternion.copy(camera.quaternion); 

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

或者,你可以使用一個THREE.Sprite

編輯:更新至three.js所r.67

+0

謝謝,該解決方案效果更好! –

+0

看r.67,quaternion屬性不再可寫。你可以做點像 'plane.setRotationFromQuaternion(camera.quaternion);'現在每一幀。 – insominx

+0

謝謝@insominx。更新了答案。 – WestLangley

6

不知何故,就在StackOverflow的發佈似乎組織和澄清我的想法:)

更好的解決方案(對於更強大的廣告牌效果)似乎是:

plane.rotation.setFromRotationMatrix(camera.matrix); 

問題中的jsFiddle代碼鏈接已經相應更新;然而,現在在平移後旋轉相機時會出現一些相機/飛機的顫抖,所以我懷疑這個解決方案還不夠理想,我很樂意接受一個能夠改善這個問題的答案。

+0

這對我來說是完美的,我沒有得到任何戰慄。謝謝,我試圖弄清楚這個好幾個小時。 – looshi