Three.js クォータニオン（Quaternion）による回転 - Three.jsを使って、作ってみた
今回は、Three.jsの「クォータニオン（Quaternion）」について書きます。 クォータニオン（Quaternion）は、簡単に言いますと、物体を回転させる方法です。 以前にも、物体を回転させる方法について書きましたが、それとは別のやり方です。 以前のやり方は、オイラー角による回転で、今回は、クォータニオン（Quaternion）による回転です。 クォータニオンについて、専門的に知りたい人は、コチラを見てください。 その10 クォータニオンを学んでみよう！ 四元数 - Wikipedia まずは、コードから～ クォータニオンはオイラー角より、複雑なコードを書きます。 実際のコードはコチラです。 //cubeは直方体（CubeGeometry）のジオメトリです。 //クォータニオン利用の宣言（必須） cube.useQuaternion = true; //回転軸ベクトルの宣言・規格
[Three.js] Quaternionを使ってオブジェクトを向かせたい方向に向かせる - jsdo.it - Share JavaScript, HTML5 and CSS
任意のベクトルの方向にオブジェクトを向ける こちらの記事を参考にしました 例えば、キャラクターを坂に載せるとき、 頭の方向をその斜面に垂直にしたい、みたいなときがあると思います。 そうしたときに使えるテクニック。 というか、とあるベクトルと平行になるように回転させる、という目的にも使えます。 (function (win, doc) { var SCREEN_WIDTH = window.innerWidth; var SCREEN_HEIGHT= window.innerHeight; var camera, scene, renderer; var logEl; var mesh; var normal = null; function log(mes) { logEl.innerHTML = mes; } /* * 初期化 */ var init = function() { { /
![[Three.js] Quaternionを使ってオブジェクトを向かせたい方向に向かせる - jsdo.it - Share JavaScript, HTML5 and CSS](https://cdn-ak-scissors.b.st-hatena.com/image/square/f66e95bdfadbca44648d0580074980212e22b854/height=288;version=1;width=512/http%3A%2F%2Fjsdo-static-contents.s3.amazonaws.com%2Fimages%2Fcapture%2Ft%2Ff%2FJ%2FtfJW.jpg%3Ft%3D1390979802)
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
