4章マテリアル

マテリアルについてはこれまでの章でも簡単に触れました。マテリアルはTHREE.Geometryと組み合わせてTHREE.Meshを構成するものであることはすでに理解できていることでしょう。マテリアルは形状の外側がどのように見えるかを定義するオブジェクトの皮のようなものです。例えばマテリアルは物体が金属のような質感か、透明か、ワイヤーフレームとして描写されるかを指定します。そのマテリアルを使用して作成したTHREE.Meshオブジェクトはシーンに追加してThree.jsで描画することができます。これまでマテリアルについてあまり詳細には説明しませんでした。この章ではThree.jsが提供しているすべてのマテリアルについて詳細に説明し、それらのマテリアルを使用して見た目のよい3Dオブジェクトを作る方法を学びます。この章では、表4-1に挙げたマテリアルについて説明します。

表4-1　マテリアル一覧

マテリアル説明
MeshBasicMaterialジオメトリに単純な色を設定するか、ワイヤーフレームで表示することができる基本的なマテリアル
MeshDepthMaterialカメラからの距離を使用してメッシュの色を決定するマテリアル
MeshNormalMaterial面の色をその法線ベクトルに従って決定する簡単なマテリアル
MultiMaterialジオメトリのそれぞれの面に独自のマテリアルを設定できるマテリアル
MeshLambertMaterialライティングを考慮し、光を鈍く反射する光沢のあまりないオブジェクトの作成に利用するマテリアル
MeshPhongMaterialMeshLambertMaterialと同様にライティングを考慮するが、光沢のあるオブジェクトの作成に利用するマテリアル ...

Get 初めてのThree.js 第2版 ―WebGLのためのJavaScript 3Dライブラリ now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial