シーン内のすべてのオブジェクトをx軸に沿って0,0,0の原点を中心に回転させたいとします。しかし、obj.rotation.x + = 0.1を設定する。原点に沿って回転するのではなく、オブジェクトの中心に沿って回転します。どのようにして原点の周りのオブジェクトの望ましい回転を達成することができますか?私は簡単な方法があるべきだと思っていますが、公式の文書やオンラインでは見つけられませんでした。Three.js:グローバルローテーション
答えて
代わりのシーンにオブジェクトを追加し、THREE.Group()
オブジェクトに追加します:
group.rotation.x += 0.1;
Threejs.r84
することができます:レンダリングループで
var group = new THREE.Group();
scene.add(group);
...
var mesh1 = new THREE.Mesh(...);
group.add(mesh1);
var mesh2 = new THREE.Mesh(...);
group.add(mesh2);
//and so on with meshes
、その後、 THREE.Object3D()
オブジェクトにすべてのメッシュを追加するmyObject.add(myMesh)
そしてangle
がラジアンであり、myObject
がObject3Dオブジェクトであり、myMesh
が追加されるメッシュである場合、myObject.rotateX(angle)
を使用します。
これは、ローカル空間でオブジェクトをx軸の周りに回転させます。
詳細はドキュメントにあります:https://threejs.org/docs/#Reference/Core/Object3D
素早く返信いただきありがとうございます。)prisoner849によって提供されたグループ化のソリューションとの違いは何ですか?どちらのアプローチも私と似ています。私は、起源の周りの回転を達成するためにシーンの構造を変えなければならないということは、残念です。だから私は簡単な解決策を探していました。懸念の視点から分かるように、原点を中心に回転を実現するためには、シーン内のオブジェクトの再グループ化が必要であるということは私には奇妙に見えます。しかし、とにかく、両方の解決策はうまくいくようですので、ありがとうございます。) –
@deusexmachina 'THREE.Group()'と 'THREE.Object3D()'の違いはあまりありません。[Documentation](https://threejs.org /docs/index.html#Reference/Objects/Group)はこう書いています:_これはObject3Dとほとんど同じです。それは、オブジェクトのグループを構文的にクリアすることを目的としています。 – prisoner849
@deusexmachinaこれらの2つの違いはありません。名前だけです。私はこの名前(単に個人的な選択)に満足しているので、一般的に 'Object3D'を使いたいと思っています。両方の違いを見たい場合は、[Group.jsコード](https://github.com/mrdoob/three.js/blob/master/src/objects/Group.js)に向かうことができます。 'Object3D'をインポートし、そのタイプを 'Group'に変更するだけです。 –
- 1. グローバルローテーション
- 2. THREE.jsでTHREE.js JSONLoaderコールバック
- 3. グローバルポジション、グローバルローテーション、ローカルローテーションがある場合のローカルポジションの計算
- 4. three.js
- 5. THREE.JSシェーダーテクスチャ
- 6. three.jsシャドウカットオフ
- 7. Three.jsキーフレームアニメーション
- 8. three.jsローディングリソース
- 9. Three.jsカメラドームローテーション
- 10. Three.jsアウトラインメッシュ
- 11. Three.jsアニメーション
- 12. Three.js - カスタムシェイプ?
- 13. Three.jsローダー
- 14. three.jsエディタ
- 15. Three.jsテクスチャ
- 16. はthree.js
- 17. Three.js Ellipse
- 18. THREE.JS - ステレオエフェクトアンチエイリアシング
- 19. THREE.jsのブレンダーエクスポート
- 20. THREE.js webGLガベージコレクション
- 21. Three.jsでのモーフィング
- 22. Three.jsスキンスケルトンメッシュインスタンス、アニメーション、ブレンディング
- 23. Three.js、グループ回転
- 24. Three.js odd transparency artifact
- 25. Three.js AWS S3 CORS
- 26. Three.jsのメモリリーク
- 27. Three.jsレンダリングとブートストラップグリッド
- 28. コーナーのスポットライトThree.js
- 29. three.js webcam as background
- 30. Angular 2 and Three.js
@ prisonder849私はそれを行いました。迅速な返事をありがとう:)私は答えとしてそれを受け入れる前に少し待つだろう。 –
@deusexmachinaよろしくお願いします。) – prisoner849