改變CSS3DObject的方向

我有一個3D場景，我想旋轉一堆CSS對象，以便它們都指向空間中的一個點。改變CSS3DObject的方向

我的CSS對象都是簡單的矩形是很多更廣泛的比他們高：

var element = document.createElement('div'); 
element.innerHTML = "test"; 
element.style.width = "75px"; 
element.style.height = "10px"; 

var object = new THREE.CSS3DObject(element); 

object.position.x = x; 
object.position.y = y; 
object.position.z = z;

標準情況下，就好像它們是「面對」 z軸創建的對象的定義。這意味着如果我使用lookAt()函數，對象將旋轉，以便「測試」文本面向該點。

我的問題是，我寧願旋轉，以便div的「右邊緣」指向期望的點。我已經嘗試了向上的矢量，但我覺得這樣做不會工作，因爲我仍然想要向上指向。我也試着先沿y軸旋轉對象Math.PI/2，但lookAt()似乎忽略了任何先前的設置旋轉。

看來我需要重新定義對象局部z向量，以便它與全局x向量一起運行。這樣，「看着」方向的對象將在場景的右側，然後lookAt()將適當地定向它。

對不起，可能是壞的術語，新手3D程序員在這裏。

來源

2017-04-07 DukeOf1Cat

Object.lookAt(point)將使對象取向，使對象的內部正z軸指向所需點的方向。

如果你想在對象的內部正x軸的所需點的方向點，您可以使用此模式：

object.lookAt(point); 
object.rotateY(- Math.PI/2);

three.js所r.84

來源

2017-04-07 15:15:19 WestLangley

這工作！在使用lookAt之後，我做了旋轉撥弄，但似乎無法圍繞正確的軸旋轉正確的數量。還沒有在我的大腦中獲得思維模式。謝謝！ – DukeOf1Cat

改變CSS3DObject的方向

回答

相關問題