在 3D 的世界中，所有物件都是由 Geometry(幾何體)＋ Material(材質) 所組成。
材質屬性有非常多可控制的項目如常見的
| 屬性 | 簡介 |
|---|---|
| Opacity 透明度 | 定義物體透明程度，0.0 為完全透明，1.0 表示不透明，若要設定透明度需先設定 transparent : true |
| Visible 是否可見 | 定義物體是否可見 |
| Color 顏色 | 定義材質顏色 |
| Map 貼圖 | 可以自行載入圖片設定到幾何體上 |
| Side 側面 | 可以定義哪一面使用材質，默認為 THREE.FrontSide，也可設定為 THREE.BackSide and THREE.DoubleSide. |
在官網中可以看到 three.js 包含了以下幾種材質
| 種類 | 簡介 |
|---|---|
| MeshBasic 網格基礎材質 | 以簡單的陰影方式繪製而成的方法，不會受到燈光的影響 |
| MeshDepth 網格深度材質 | 由物體到相機的距離決定外觀，最靠近是白色，最遠是黑色 |
| MeshLambertMaterial 網格朗伯特材質 | 用於無光澤表面的材質，並會受燈光影響，適合用於木材或石頭等黯淡並無光澤的表面 |
| Matcap 網格材質捕捉 | 在沒有燈光的情境下模擬物體被燈光照射的效果，因此不受燈光影響 |
| MeshNormal 網格法向量 | 將法向量映射到RGB顏色的材質 |
| MeshPhong 網格馮式材質 | 用於有光澤的表面，並會受燈光影響 |
| MeshStandard 網格標準材質 | 基於 Physically based rendering (PBR )計算方式，不以近似值呈現光與材質的交互作用，提供更準確的結果，但計算成本也相對較高 |
| MeshPhysical 網格物理材質 | MeshStandard 的延伸，多了透明塗層、物體透明度、反射率 |
| MeshToon 網格卡通材質 | 實現卡通著色的材料 |
https://threejs.org/docs/#api/en/materials/Material
iThome鐵人賽
看影片追技術