Three.js[1]-使用ライブラリの説明など。HVNホーム紹介Three.js[1]-使用ライブラリの説明など。sib少々遅れてしまったけど、three.jsでスタディしたものの説明をしておく。スタディのインデックスを作成しておいた。study:index頭にthree.js:とついている物がthree.jsでのスタディになる。particle(X)は以前作成したCANVASでのベクトルスタディだ。今回は、主に使用ライブラリに関連すること及び以下2つを少々と説明していく。three.js:study02three.js:study01まずは、githubのexamplesを参考に必要なライブラリを導入する。HTMLファイルのスターティングとしては、HTML5boilerplateを使用し、追加ライブラリをjs/mylibs/以下に、各スタディ用のjsファイルを配置している。src="js/script01.js"></script>各ファイルを説明すると。[Three.js]これは、もちろんThree.jsの本体ファイル。[Detector.js]webGLが使えるかどうか判定し、使えなかったらメッセージを出してくれます。こんな感じで使用する。$("#stage")[0]});}[RequestAnimationFrame.js]これまではアニメーションさせるのにsetIntervalやsetTimeoutを使用していたが、よりアニメーションの再生に最適なrequestAnimationFrameというのが登場してきた。よーしおまえらー、アニメーションにsetInterval使うなよーまだNon-standardではあるが、それが使えるならば使用できるようにしたのがRequestAnimationFrame.jsだ。animating[Stats.js]これはjsのパフォーマンスをFPSやMSで示してくれる。別個にgithubも存在している。https://github.com/mrdoob/stats.js使用方法は、こんな感じ。);以上が使われているライブラリに対するざっくりした説明になる。つぎは、簡単にスタディの説明をする。study01のスタートポイントは、three.jsのgithub中段Usage項目及びaerotwistのチュートリアルだ。THREE.JSこの2つより、ワイヤーとフォンシェーディングで出来ることを作成してみた。study02はstudy01を元にシェーディングされた物で、構成してみた。次回、ワイヤー系で何ができるかを試したものを説明する。Comment返信をキャンセルする。