three.js 材质

今天郭先生说一说three.js的材质。材质描述了对象objects的外观。它们的定义方式与渲染器无关, 因此,如果您决定使用不同的渲染器,不必重写材质。

1. three.js材质基类

所有其他材质类型都继承了Material。

下面是一些属性:

.alphaTest : Float
设置运行alphaTest时要使用的alpha值。如果不透明度低于此值,则不会渲染材质。默认值为0。

.blendDst : Integer
混合目标。默认值为OneMinusSrcAlphaFactor。 目标因子所有可能的取值请参阅constants。 必须将材质的blending设置为CustomBlending才能生效。
.blendDstAlpha : Integer
.blendDst的透明度。 默认值为 null.

.blendEquation : Integer
使用混合时所采用的混合方程式。默认值为AddEquation。 混合方程式所有可能的取值请参阅constants。 必须将材质的blending设置为CustomBlending才能生效。
.blendEquationAlpha : Integer
.blendEquation 的透明度. 默认值为 null.

.blending : Blending
在使用此材质显示对象时要使用何种混合。
必须将其设置为CustomBlending才能使用自定义blendSrc, blendDst 或者 [page:Constant blendEquation]。 混合模式所有可能的取值请参阅constants。默认值为NormalBlending。

.blendSrc : Integer
混合源。默认值为SrcAlphaFactor。 源因子所有可能的取值请参阅constants。
必须将材质的blending设置为CustomBlending才能生效。

.blendSrcAlpha : Integer
.blendSrc的透明度。 默认值为 null.

.clipIntersection : Boolean
更改剪裁平面的行为,以便仅剪切其交叉点,而不是它们的并集。默认值为 false。

.clippingPlanes : Array
用户定义的剪裁平面,在世界空间中指定为THREE.Plane对象。这些平面适用于所有使用此材质的对象。空间中与平面的有符号距离为负的点被剪裁(未渲染)。 这需要WebGLRenderer.localClippingEnabled为true。 示例请参阅WebGL / clipping /intersection。默认值为 null。

.clipShadows : Boolean
定义是否根据此材质上指定的剪裁平面剪切阴影。默认值为 false。

.colorWrite : Boolean
是否渲染材质的颜色。 这可以与网格的renderOrder属性结合使用,以创建遮挡其他对象的不可见对象。默认值为true。

.defines : Object
注入shader的自定义对象。 以键值对形式的对象传递,{ MY_CUSTOM_DEFINE: ‘’ , PI2: Math.PI * 2 }。 这些键值对在顶点和片元着色器中定义。默认值为undefined。

.depthFunc : Integer
使用何种深度函数。默认为LessEqualDepth。 深度模式所有可能的取值请查阅constants。

.depthTest : Boolean
是否在渲染此材质时启用深度测试。默认为 true。

.depthWrite : Boolean
渲染此材质是否对深度缓冲区有任何影响。默认为true。

在绘制2D叠加时,将多个事物分层在一起而不创建z-index时,禁用深度写入会很有用。

.flatShading : Boolean
定义材质是否使用平面着色进行渲染。默认值为false。

.fog : Boolean
材质是否受雾影响。默认为true。

.id : Integer
此材质实例的唯一编号。

.isMaterial : Boolean
用于检查此类或派生类是否为材质。默认值为 true。

因为其通常用在内部优化,所以不应该更改该属性值。

.lights : Boolean
材质是否受到光照的影响。默认为true。

.name : String
对象的可选名称(不必是唯一的)。默认值为空字符串。

.needsUpdate : Boolean
指定需要重新编译材质。
实例化新材质时,此属性自动设置为true。

.opacity : Float
在0.0 - 1.0的范围内的浮点数,表明材质的透明度。值0.0表示完全透明,1.0表示完全不透明。
如果材质的transparent属性未设置为true,则材质将保持完全不透明,此值仅影响其颜色。 默认值为1.0。
.polygonOffset : Boolean
是否使用多边形偏移。默认值为false。这对应于WebGL的GL_POLYGON_OFFSET_FILL功能。

.polygonOffsetFactor : Integer
设置多边形偏移系数。默认值为0。

.polygonOffsetUnits : Integer
设置多边形偏移单位。默认值为0。

.precision : String
重写此材质渲染器的默认精度。可以是"highp", “mediump” 或 “lowp”。默认值为null。

.premultipliedAlpha : Boolean
是否预乘alpha(透明度)值。有关差异的示例,请参阅WebGL / Materials / Transparency。 默认值为false。

.dithering : Boolean
是否对颜色应用抖动以消除条带的外观。默认值为 false。

.shadowSide : Integer
定义投影的面。设置时,可以是THREE.FrontSide, THREE.BackSide, 或Materials。默认值为 null。
如果为null, 则面投射阴影确定如下:
Material.side Side casting shadows
THREE.FrontSide 背面
THREE.BackSide 前面
THREE.DoubleSide 双面
.side : Integer
定义将要渲染哪一面 - 正面,背面或两者。 默认为THREE.FrontSide。其他选项有THREE.BackSide和THREE.DoubleSide。

.transparent : Boolean
定义此材质是否透明。这对渲染有影响,因为透明对象需要特殊处理,并在非透明对象之后渲染。
设置为true时,通过设置材质的opacity属性来控制材质透明的程度。
默认值为false。

.type : String
值是字符串’Material’。不应该被更改,并且可以用于在场景中查找此类型的所有对象。

.uuid : String
此材质实例的UUID,会自动分配,不应该被更改。

.vertexColors : Integer
是否使用顶点着色。默认值为THREE.NoColors。 其他选项有THREE.VertexColors 和 THREE.FaceColors。

.vertexTangents : Boolean
TODO.

.visible : Boolean
此材质是否可见。默认为true。

.userData : object
一个对象,可用于存储有关Material的自定义数据。它不应该包含对函数的引用,因为这些函数不会被克隆。

下面是一些方法:

EventDispatcher 方法在此类中可用。
.clone ( ) : Material
返回与此材质具有相同参数的新材质。

.copy ( material : material ) : Material
将被传入材质中的参数复制到此材质中。

.dispose () : null
处理材质。材质的纹理不会被处理。需要通过Texture处理。

.onBeforeCompile ( shader : Shader, renderer : WebGLRenderer ) : null
在编译shader程序之前立即执行的可选回调。此函数使用shader源码作为参数。用于修改内置材质。

.setValues ( values : object ) : null
values – 具有参数的容器。 根据values设置属性。
.toJSON ( meta : object ) : null
meta – 包含元素,例如材质的纹理或图像。 将材质转换为three.js JSON格式。

2. three.js材质种类

名称 介绍
LineBasicMaterial 一种用于绘制线框样式几何体的材质。
LineDashedMaterial 一种用于绘制虚线样式几何体的材质。
MeshBasicMaterial 一个以简单着色(平面或线框)方式来绘制几何体的材质。这种材质不受光照的影响。
MeshLambertMaterial 一种非光泽表面的材质,没有镜面高光。该材质使用基于非物理的Lambertian模型来计算反射率。 这可以很好地模拟一些表面(例如未经处理的木材或石材),但不能模拟具有镜面高光的光泽表面(例如涂漆木材)。
MeshPhongMaterial 一种用于具有镜面高光的光泽表面的材质。该材质使用非物理的Blinn-Phong模型来计算反射率。 与MeshLambertMaterial中使用的Lambertian模型不同,该材质可以模拟具有镜面高光的光泽表面(例如涂漆木材)。
MeshNormalMaterial 一种把法向量映射到RGB颜色的材质。
MeshDepthMaterial 一种按深度绘制几何体的材质。深度基于相机远*面。白色最近,黑色最远。
MeshDistanceMaterial 在内部用于使用PointLight来实现阴影映射。
MeshMatcapMaterial 由一个材质捕捉(MatCap,或光照球(Lit Sphere))纹理所定义,其编码了材质的颜色与明暗。可以理解为自带光效果的材质
MeshToonMaterial MeshPhongMaterial卡通着色的扩展。
PointsMaterial 点材质,粒子系统所使用的缺省材料。
SpriteMaterial 点精灵材质,一种使用Sprite的材质。
MeshPhysicalMaterial MeshStandardMaterial的扩展,能够更好地控制反射率。请注意,为了获得最佳效果,您在使用此材质时应始终指定环境贴图。
MeshStandardMaterial 一种基于物理的标准材质,使用Metallic-Roughness工作流程。这种方法与旧方法的不同之处在于,不使用近似值来表示光与表面的相互作用,而是使用物理上正确的模型。 我们的想法是,不是在特定照明下调整材质以使其看起来很好,而是可以创建一种材质,能够“正确”地应对所有光照场景。
ShadowMaterial 此材质可以接收阴影,但在其他方面完全透明。
ShaderMaterial 使用自定义shader渲染的材质。 shader是一个用GLSL编写的小程序 ,在GPU上运行。 您可能需要使用自定义shader,

这些材料都很常见,这里最最重要的是ShaderMaterial(着色器材质)。日后我将花大量时间说这个,但是现在还不是时候,日后说说Vector3,Matrix3,Matrix4,Quaternion,然后在说说着色器语言。

转载请注明地址:郭先生的博客

 

three.js 材质

上一篇:ubuntu1804 安装 openvswitch + ryu+mininet


下一篇:HTML5实现浏览器端大文件分块上传