NON STOP TECH BLOG

ノンストップで書きまくる技術ブログ

初めてのThree.jsを読む #1

オライリーから出ている「初めてのThree.js」を買ったので、学んだことをまとめていきます。
あくまで自分用のメモ。

1章 初めての3Dシーン作成

  • Sceneオブジェクトがなければ何も描画されない
  • Cameraオブジェクトはシーンを描画するときに何が見えるかを決定する
  • rendererオブジェクトはCameraオブジェクトの角度に基づいてブラウザ内でSceneオブジェクトがどの様に見えるかを計算する
  • axesオブジェクトはデバッグ用ツール。オブジェクトがどこに描画されるか確認できる
  • THREE.PlaneGeometry()はPlaneオブジェクトの幅と高さを定義
  • Three.jsはマテリアルオブジェクトを作成することでオブジェクトの見た目を指定できる。
  • MeshBasicMaterialは光源には反応しない
  • MeshLambertMaterialは光源に反応する
  • Three.jsは影の描画をデフォルトで無効化している
  • 影の有効化は、rendererのshadowMapのenabledをtrueにし、描画している各オブジェクトのreceiveShadow/castShadowをtrueにする
  • シーンのアニメーションにはrequestAnimationFrame関数を仕様する
  • stats.jsを使って1秒ごとのフレーム数を確認する
  • dat.GUIを使って、GUIから物体の回転速度や移動速度を制御する

一回読んだだけで覚えられる気がしない。。。 何回もくりかえしですね!