学习threejs，Materials常量汇总

👨‍⚕️ 主页： gis分享者

👨‍⚕️ 感谢各位大佬点赞👍 收藏⭐ 留言📝 加关注✅!

👨‍⚕️ 收录于专栏：threejs gis工程师

文章目录

一、🍀前言
- [1.1 ☘️Materials常量汇总](#1.1 ☘️Materials常量汇总)
- - [1.1.1 面](#1.1.1 面)
  - [1.1.2 混合模式](#1.1.2 混合模式)
  - [1.1.3 深度模式](#1.1.3 深度模式)
  - [1.1.4 纹理结合操作](#1.1.4 纹理结合操作)
  - [1.1.5 模板函数](#1.1.5 模板函数)
  - [1.1.6 模板操作](#1.1.6 模板操作)
  - [1.1.7 GLSL Version](#1.1.7 GLSL Version)

一、🍀前言

本文详细threejs材质Materials相关常量。希望能帮助到您。一起学习，加油！加油！

1.1 ☘️Materials常量汇总

由这些常量定义的属性对所有的材质类型都生效。

1.1.1 面

javascript 复制代码

THREE.FrontSide
THREE.BackSide
THREE.DoubleSide
THREE.TwoPassDoubleSide

定义了哪一边的面将会被渲染 ------ 正面，或是反面，还是两个面都渲染。默认值是FrontSide（只渲染正面）。

TwoPassDoubleSide 将按前后顺序分两次渲染双面透明材料，以减轻透明伪影。

1.1.2 混合模式

javascript 复制代码

THREE.NoBlending
THREE.NormalBlending
THREE.AdditiveBlending
THREE.SubtractiveBlending
THREE.MultiplyBlending
THREE.CustomBlending

这些值控制着源和目标材质中，被发送到WebGLRenderer，来给WebGL使用的包含有RGB和Alpha数据的混合方程。

默认值是NormalBlending。

请注意，CustomBlending必须被设置为自定义混合方程（Custom Blending Equations）常量中的值。

1.1.3 深度模式

javascript 复制代码

THREE.NeverDepth
THREE.AlwaysDepth
THREE.LessDepth
THREE.LessEqualDepth
THREE.GreaterEqualDepth
THREE.GreaterDepth
THREE.NotEqualDepth

材质使用这些深度函数来比较输入像素和缓冲器中Z-depth的值。如果比较的结果为true，则将绘制像素。

NeverDepth 永远不返回true。

AlwaysDepth 总是返回true。

LessDepth 当输入像素Z-depth小于当前缓冲器Z-depth时，返回true。

LessEqualDepth 为默认值，当输入像素Z-depth小于或等于当前缓冲器Z-depth时，返回true。

GreaterEqualDepth 当输入像素Z-depth大于或等于当前缓冲器Z-depth时，返回true。

GreaterDepth 当输入像素Z-depth大于当前缓冲器Z-depth时，返回true。

NotEqualDepth 当输入像素Z-depth不等于当前缓冲器Z-depth时，返回true。

1.1.4 纹理结合操作

javascript 复制代码

THREE.MultiplyOperation
THREE.MixOperation
THREE.AddOperation

这些常量定义了物体表面颜色与环境贴图（如果存在的话）相结合的结果，用在MeshBasicMaterial、MeshLambertMaterial和MeshPhongMaterial当中。

MultiplyOperation 是默认值，它将环境贴图和物体表面颜色进行相乘。

MixOperation 使用反射率来混和两种颜色。使用反射率混合两种颜色。

AddOperation 用于对两种颜色进行相加。

1.1.5 模板函数

javascript 复制代码

THREE.NeverStencilFunc
THREE.LessStencilFunc
THREE.EqualStencilFunc
THREE.LessEqualStencilFunc
THREE.GreaterStencilFunc
THREE.NotEqualStencilFunc
THREE.GreaterEqualStencilFunc
THREE.AlwaysStencilFunc

材质使用的模板函数，用于决定是否执行一项模板操作.

NeverStencilFunc 一定会返回true.

LessStencilFunc 当模板基准值比当前模板值小的时候返回true.

EqualStencilFunc 当模板基准值和当前模板值一样的时候返回true.

LessEqualStencilFunc 当模板基准值小于等于当前模板值的时候返回true.

GreaterStencilFunc 当模板基准值比当前模板值大的时候返回true.

NotEqualStencilFunc 当模板基准值与当前模板值不相等的时候返回true.

GreaterEqualStencilFunc 当模板基准值比当前模板值大的时候返回true.

AlwaysStencilFunc 一定会返回true.

1.1.6 模板操作

javascript 复制代码

THREE.ZeroStencilOp
THREE.KeepStencilOp
THREE.ReplaceStencilOp
THREE.IncrementStencilOp
THREE.DecrementStencilOp
THREE.IncrementWrapStencilOp
THREE.DecrementWrapStencilOp
THREE.InvertStencilOp

当提供的模板函数通过的时候，材质会在模板缓冲像素上执行怎样的模板操作.

ZeroStencilOp 将模板值设置为0。

KeepStencilOp 不会对模板值进行任何操作。

ReplaceStencilOp 使用模板基准值覆盖模板值。

IncrementStencilOp 将当前模板值加1。

DecrementStencilOp 将当前模板值减1。

IncrementWrapStencilOp 将当前模板值加1，如果这个值超过了255则会设置为0。

DecrementWrapStencilOp 将当前模板值减1，如果这个值低于0则会设置为255

InvertStencilOp 将当前模板值按位反转.

1.1.7 GLSL Version

javascript 复制代码

THREE.GLSL1
THREE.GLSL3