THREE.jsのマテリアル

ちょっとしたアプリを作っていて、アクセントとして炎を描画したかった。少し勉強して、実は凄く難しい要求をしていたことを知った。

THREE.jsを触った。OpenGLを書いたことがあってもCGは未経験なので、マテリアルと言われてもあまりピンとこなかったり。

MeshBasicMaterial

法線情報を使わない、単色のマテリアル。

alphaMap(アルファマップ), aoMap(アンビエント・オクルージョン), envMap(環境マップ)など色々なマップを追加指定できる。名前を聞いたことがあるくらいで、使い方は全くわかりません。

MeshNormalMaterial

法線ベクトルをRGBにマッピングするマテリアル。時々みかける青がかった3Dモデルはこれ。

MeshMatcapMaterial

テカリ用テクスチャを使い、球体を球体らしく見せるらしい。

MeshDepthMaterial

カメラのnearに近いほど白く、farに近いほど黒になるマテリアル。

MeshLambertMaterial

光源に対してLambert反射モデルを使うマテリアル。

MeshPhongMaterial

光源に対してPhong反射モデルを使うマテリアル。

MeshStandardMaterial

反射を扱う標準マテリアル。metlaness, roughnessといったパラメータがある。

MeshToonMaterial

明暗に応じて2色のトゥーンレンダリングを行うマテリアル。