Three.js中的材质（Material）是实现引人注目的3D效果的关键组件之一。本篇博客中，我们将深入探讨Three.js中的材质类型、属性和用法。

推荐：将NSDT 编辑器加入你的3D工具链

如果你只会一个 Vue 或者 React 的简单使用的话现在找工作是很难的。

前言

完成效果

gif 图较大，耐心等待，源码见文末

为了上班摸鱼合理的玩游戏，我写了一个3d塔防游戏，其中功能包含动画、敌人运动、放置武器、升级武器、销毁武器、动态检测等功能。请动动小手，点赞收藏，这就发车~

在Three.js中，一个可见的物体是由几何体和材料构成的。在这个教程中，我们将学习如何从头开始创建新的网格几何体，研究Three.js为处理几何对象和材质所提供的相关支持。

1、索引面集/Indexed Face Sets

继 Harry Alisavakis 令人惊叹的汤着色器之后，我想使用 Three.js 重新创建类似的卡通着色效果。 我从 Roystan 的卡通着色器教程开始，它是为 Unity 编写的。 在这篇文章中，我将把 Roystan 教程中概述的原则翻译成 Three.js。 下面描述的着色器为创建更加风格化的着色器提供了良好的基础。