2016-12-14 6 views
0

ThreeJSのdummie \ newbieです。 :)Mesh.position.xが負の場合、ThreeJSキューブが自動的に回転します。

とにかく、これは、Meshの位置を設定したときのThreeJSのデフォルトの動作だと思います。

私は、Project's Work Breakdown Structure(WBS)に似たThreeJSで構造を再現しようとしています。下の画像を参照してください。 WBS内のすべてのboxes \ cubesが整列されます。

enter image description here

これはThreeJSで私のコードで何が起こっているかである。

enter image description here

私は、パラメータとして、このようなオブジェクトを受け入れcreateCubeと呼ばれるヘルパー関数を作成:

var gestaoProjeto = createCube(
{ face1: { color: 'yellow', text: '1', textColor: 'yellow' }, 
    face2: { text: '2', textColor: 'blue' }, 
    face3: { text: '3', textColor: 'black' }, 
    face4: { text: '4', textColor: 'cyan' }, 
    face5: { color: 'red', text: 'Gestão do Projeto', textColor: 'yellow' }, 
    face6: { text: '6', textColor: 'gray' }, 
    x: -400, 
    y: 125 
}); 

私は立方体の赤い顔をカメラ\ユーザーの前に置いて、それをmユーザーがシーンとやりとりする場合にのみ、OrbitControlsを使用してください。上記の画像でわかるように、face1(黄色)の部分がすでに表示されており、face5が回転しています。

私が行う場合:

gestaoProjeto.rotation.set(-0.1,0.5,0); 

それが回転するが、それはよくないですし、私は彼らの位置に応じて、すべてのキューブを回転させる必要があるだろう。

「自動的に」したいことを達成することは可能ですか?

答えて

1

ユーザーはThreeJS IRC Channelで回答していました。

彼はPerspectiveCameraの代わりにOrthographicCameraを使用するように指示しましたが、これはほとんどのサンプルで使用されています。

いくつかの背景に興味のある人のための

は、ここではカメラの種類については本当に素敵な説明を行く:

これらのメッシュをレンダリングするために、カメラはどのように彼らが必要レンダラを伝えるために配置されなければならないためには

見ることができる。 Three.jsには正射投影と遠近投影という2種類のカメラがあります。正射投影は、カメラからどれくらい離れていても、同じスケールですべてのオブジェクトを表示するパースペクティブを排除します。パースペクティブによるサイズが異なると、オブジェクトのサイズを区別することが困難になる可能性があるため、これはエンジニアリングに役立ちます。家具やモデルカーを組み立てるには、正射投影をどの方向にでも認識することができます。パースペクティブカメラは、シーンに対するその位置のプロパティを含み、その名前が示すように、カメラからのプロパティの距離に基づいてモデルのサイズをレンダリングすることができます。 カメラは、シーンの視錐台または可視領域を制御します。視錐台は、箱の寸法を定義する「アスペクト比」とともに、その近傍特性および遠見特性(面積が開始および停止する平面)によって定義されるボックスとして描写することができる。視域錐体の外側に存在するオブジェクトはシーンに描画されませんがレンダリングされます。

出典:https://www.smashingmagazine.com/2013/09/introduction-to-polygonal-modeling-and-three-js/#cameras

関連する問題