|
|
@@ -10,52 +10,41 @@
|
|
|
<body>
|
|
|
[page:Material] →
|
|
|
|
|
|
- <h1>[name]</h1>
|
|
|
+ <h1>着色器材质([name])</h1>
|
|
|
|
|
|
- <p class="desc">
|
|
|
- A material rendered with custom shaders. A shader is a small program written in
|
|
|
- [link:https://www.khronos.org/files/opengles_shading_language.pdf GLSL] that runs on the GPU.
|
|
|
- You may want to use a custom shader if you need to:
|
|
|
+ <p class="desc"> 使用自定义shader渲染的材质。
|
|
|
+ shader是一个用[link:https://www.khronos.org/files/opengles_shading_language.pdf GLSL]编写的小程序 ，在GPU上运行。
|
|
|
+ 您可能需要使用自定义shader，如果你要：
|
|
|
<ul>
|
|
|
- <li>implement an effect not included with any of the built-in [page:Material materials]</li>
|
|
|
- <li>combine many objects into a single [page:Geometry] or [page:BufferGeometry] in order to improve performance</li>
|
|
|
+ <li>要实现内置 [page:Material materials] 之外的效果。</li>
|
|
|
+ <li>将许多对象组合成单个[page:Geometry]或[page:BufferGeometry]以提高性能。</li>
|
|
|
</ul>
|
|
|
- There are the following notes to bear in mind when using a *ShaderMaterial*:
|
|
|
-
|
|
|
+ 使用*ShaderMaterial*时需要注意以下注意事项：
|
|
|
<ul>
|
|
|
- <li>
|
|
|
- A *ShaderMaterial* will only be rendered properly by [page:WebGLRenderer],
|
|
|
- since the GLSL code in the [link:https://en.wikipedia.org/wiki/Shader#Vertex_shaders vertexShader]
|
|
|
- and [link:https://en.wikipedia.org/wiki/Shader#Pixel_shaders fragmentShader] properties must
|
|
|
- be compiled and run on the GPU using WebGL.
|
|
|
+ <li>*ShaderMaterial* 只有使用 [page:WebGLRenderer] 才可以绘制正常，
|
|
|
+ 因为 [link:https://en.wikipedia.org/wiki/Shader#Vertex_shaders vertexShader]
|
|
|
+ 和 [link:https://en.wikipedia.org/wiki/Shader#Pixel_shaders fragmentShader]
|
|
|
+ 属性中GLSL代码必须使用WebGL来编译并运行在GPU中。
|
|
|
</li>
|
|
|
- <li>
|
|
|
- As of THREE r72, directly assigning attributes in a ShaderMaterial is no longer supported.
|
|
|
- A [page:BufferGeometry] instance (instead of a [page:Geometry] instance) must be used instead,
|
|
|
- using [page:BufferAttribute] instances to define custom attributes.
|
|
|
+ <li> 从 THREE r72开始，不再支持在ShaderMaterial中直接分配属性。
|
|
|
+ 必须使用 [page:BufferGeometry]实例 (而不是 [page:Geometry] 实例)，使用[page:BufferAttribute]实例来定义自定义属性。
|
|
|
</li>
|
|
|
- <li>
|
|
|
- As of THREE r77, [page:WebGLRenderTarget] or [page:WebGLRenderTargetCube] instances
|
|
|
- are no longer supposed to be used as uniforms. Their [page:Texture texture] property
|
|
|
- must be used instead.
|
|
|
+ <li> 从 THREE r77开始，[page:WebGLRenderTarget] 或 [page:WebGLRenderTargetCube] 实例不再被用作uniforms。
|
|
|
+ 必须使用它们的[page:Texture texture] 属性。
|
|
|
</li>
|
|
|
- <li>
|
|
|
- Built in attributes and uniforms are passed to the shaders along with your code.
|
|
|
- If you don't want the [page:WebGLProgram] to add anything to your shader code, you can use
|
|
|
- [page:RawShaderMaterial] instead of this class.
|
|
|
+ <li> 内置attributes和uniforms与代码一起传递到shaders。
|
|
|
+ 如果您不希望[page:WebGLProgram]向shader代码添加任何内容，则可以使用[page:RawShaderMaterial]而不是此类。
|
|
|
</li>
|
|
|
- <li>
|
|
|
- You can use the directive #pragma unroll_loop in order to unroll a *for* loop in GLSL by the shader preprocessor.
|
|
|
- The directive has to be placed right above the loop. The loop formatting has to correspond to a defined standard.
|
|
|
+ <li> 您可以使用指令#pragma unroll_loop，以便通过shader预处理器在GLSL中展开for循环。
|
|
|
+ 该指令必须放在循环的正上方。循环格式必须与定义的标准相对应。
|
|
|
<ul>
|
|
|
- <li>
|
|
|
- The loop has to be [link:https://en.wikipedia.org/wiki/Normalized_loop normalized].
|
|
|
+ <li> 循环必须标准化[link:https://en.wikipedia.org/wiki/Normalized_loop normalized]。
|
|
|
</li>
|
|
|
<li>
|
|
|
- The loop variable has to be *i*.
|
|
|
+ 循环变量必须是*i*。
|
|
|
</li>
|
|
|
<li>
|
|
|
- The loop has to use a certain whitespace formatting.
|
|
|
+ 循环必须使用某种空格格式。
|
|
|
</li>
|
|
|
</ul>
|
|
|
<code>
|
|
|
@@ -70,7 +59,7 @@
|
|
|
</ul>
|
|
|
</p>
|
|
|
|
|
|
- <h2>Examples</h2>
|
|
|
+ <h2>例子(Examples)</h2>
|
|
|
|
|
|
<p>
|
|
|
[example:webgl_animation_cloth webgl / animation / cloth ]<br />
|
|
|
@@ -122,95 +111,80 @@
|
|
|
} );
|
|
|
</code>
|
|
|
|
|
|
- <h2>Vertex shaders and fragment shaders</h2>
|
|
|
+ <h2>顶点着色器和片元着色器(Vertex shaders and fragment shaders)</h2>
|
|
|
|
|
|
<div>
|
|
|
- <p>You can specify two different types of shaders for each material:</p>
|
|
|
+ <p>您可以为每种材质指定两种不同类型的shaders：:</p>
|
|
|
<ul>
|
|
|
- <li>
|
|
|
- The vertex shader runs first; it receives *attributes*, calculates / manipulates
|
|
|
- the position of each individual vertex, and passes additional data (*varying*s) to the fragment shader.
|
|
|
+ <li> 顶点着色器首先运行; 它接收*attributes*，
|
|
|
+ 计算/操纵每个单独顶点的位置，并将其他数据（*varying*s）传递给片元着色器。
|
|
|
</li>
|
|
|
<li>
|
|
|
- The fragment ( or pixel ) shader runs second; it sets the color of each individual "fragment"
|
|
|
- (pixel) rendered to the screen.
|
|
|
+ 片元（或像素）着色器后运行; 它设置渲染到屏幕的每个单独的“片元”（像素）的颜色。
|
|
|
</li>
|
|
|
</ul>
|
|
|
- <p>There are three types of variables in shaders: uniforms, attributes, and varyings:</p>
|
|
|
+ <p>shader中有三种类型的变量: uniforms, attributes, and varyings:</p>
|
|
|
<ul>
|
|
|
- <li>
|
|
|
- *Uniforms* are variables that have the same value for all vertices - lighting, fog,
|
|
|
- and shadow maps are examples of data that would be stored in uniforms.
|
|
|
- Uniforms can be accessed by both the vertex shader and the fragment shader.
|
|
|
+ <li>*Uniforms*是所有顶点都具有相同的值的变量。
|
|
|
+ 比如灯光，雾，和阴影贴图就是被储存在uniforms中的数据。
|
|
|
+ uniforms可以通过顶点着色器和片元着色器来访问。
|
|
|
</li>
|
|
|
- <li>
|
|
|
- *Attributes* are variables associated with each vertex---for instance, the vertex position,
|
|
|
- face normal, and vertex color are all examples of data that would be stored in attributes.
|
|
|
- Attributes can <em>only</em> be accessed within the vertex shader.
|
|
|
+ <li> *Attributes* 与每个顶点关联的变量。例如，顶点位置，法线和顶点颜色都是存储在attributes中的数据。attributes <em>只</em>
|
|
|
+ 可以在顶点着色器中访问。
|
|
|
</li>
|
|
|
- <li>
|
|
|
- *Varyings* are variables that are passed from the vertex shader to the fragment shader.
|
|
|
- For each fragment, the value of each varying will be smoothly interpolated from the values of adjacent vertices.
|
|
|
+ <li> *Varyings* 是从顶点着色器传递到片元着色器的变量。对于每一个片元，每一个varying的值将是相邻顶点值的平滑插值。
|
|
|
</li>
|
|
|
</ul>
|
|
|
- <p>
|
|
|
- Note that <em>within</em> the shader itself, uniforms and attributes act like constants;
|
|
|
- you can only modify their values by passing different values to the buffers from your JavaScript code.
|
|
|
+ <p> 注意：在shader <em>内部</em>，uniforms和attributes就像常量；你只能使用JavaScript代码通过缓冲区来修改它们的值。
|
|
|
</p>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
- <h2>Built-in attributes and uniforms</h2>
|
|
|
+ <h2>内置attributes 和 uniforms(Built-in attributes and uniforms)</h2>
|
|
|
|
|
|
<div>
|
|
|
<p>
|
|
|
- The [page:WebGLRenderer] provides many attributes and uniforms to shaders by default;
|
|
|
- definitions of these variables are prepended to your *fragmentShader* and *vertexShader*
|
|
|
- code by the [page:WebGLProgram] when the shader is compiled; you don't need to declare them yourself.
|
|
|
- See [page:WebGLProgram] for details of these variables.
|
|
|
+ [page:WebGLRenderer]默认情况下为shader提供了许多attributes和uniforms；
|
|
|
+ 这些变量定义在着色器程序编译时被自动添加到*片元着色器*和*顶点着色器*代码的前面，你不需要自己声明它们。
|
|
|
+ 这些变量的描述请参见[page:WebGLProgram]。
|
|
|
</p>
|
|
|
<p>
|
|
|
- Some of these uniforms or attributes (e.g. those pertaining lighting, fog, etc.)
|
|
|
- require properties to be set on the material in order for [page:WebGLRenderer] to copy
|
|
|
- the appropriate values to the GPU - make sure to set these flags if you want to use these
|
|
|
- features in your own shader.
|
|
|
+ 这些uniforms或attributes（例如，那些和照明，雾等相关的）要求属性设置在材料上，
|
|
|
+ 以便 [page:WebGLRenderer]来拷贝合适的值到GPU中。
|
|
|
+ 如果你想在自己的shader中使用这些功能，请确保设置这些标志。
|
|
|
</p>
|
|
|
<p>
|
|
|
- If you don't want [page:WebGLProgram] to add anything to your shader code, you can use
|
|
|
- [page:RawShaderMaterial] instead of this class.
|
|
|
+ 如果你不希望[page:WebGLProgram] 向你的shader代码中添加任何东西，
|
|
|
+ 你可以使用[page:RawShaderMaterial] 而不是这个类。
|
|
|
</p>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
- <h2>Custom attributes and uniforms</h2>
|
|
|
+ <h2>自定义 attributes 和 uniforms(Custom attributes and uniforms)</h2>
|
|
|
|
|
|
<div>
|
|
|
<p>
|
|
|
- Both custom attributes and uniforms must be declared in your GLSL shader code
|
|
|
- (within *vertexShader* and/or *fragmentShader*). Custom uniforms must be defined in <em>both</em>
|
|
|
- the *uniforms* property of your *ShaderMaterial*, whereas any custom attributes must be
|
|
|
- defined via [page:BufferAttribute] instances. Note that *varying*s only need to
|
|
|
- be declared within the shader code (not within the material).
|
|
|
+ 自定义attributes和uniforms必须在GLSL着色器代码中声明（在 *vertexShader* 和/或 *fragmentShader* 中)。
|
|
|
+ 自定义uniforms必须定义为 *ShaderMaterial* 的 *uniforms* 属性，
|
|
|
+ 而任何自定义attribtes必须通过[page:BufferAttribute]实例来定义。
|
|
|
+ 注意 *varying*s 只需要在shader代码中声明（而不必在材料中）。
|
|
|
</p>
|
|
|
- <p>
|
|
|
- To declare a custom attribute, please reference the [page:BufferGeometry] page for an overview,
|
|
|
- and the [page:BufferAttribute] page for a detailed look at the *BufferAttribute* API.
|
|
|
+ <p> 要声明一个自定义属性，更多细节请参考[page:BufferGeometry]页面，
|
|
|
+ 以及 [page:BufferAttribute] 页面关于*BufferAttribute* 接口。
|
|
|
</p>
|
|
|
<p>
|
|
|
- When creating your attributes, each typed array that you create to hold your
|
|
|
- attribute's data must be a multiple of your data type's size. For example, if your
|
|
|
- attribute is a [page:Vector3 THREE.Vector3] type, and you have 3000 vertices in your
|
|
|
- [page:BufferGeometry], your typed array value must be created with a length of 3000 * 3,
|
|
|
- or 9000 (one value per-component). A table of each data type's size is shown below for reference:
|
|
|
+ 当创建attributes时，您创建的用来保存属性数据的每个类型化数组（typed array）必须是您的数据类型大小的倍数。
|
|
|
+ 比如，如果你的属性是一个[page:Vector3 THREE.Vector3]类型，并且在你的缓存几何模型[page:BufferGeometry]中有3000个顶点，
|
|
|
+ 那么你的类型化数组的长度必须是3000 * 3，或者9000（一个顶点一个值）。每个数据类型的尺寸如下表所示：
|
|
|
</p>
|
|
|
|
|
|
<table>
|
|
|
- <caption><a id="attribute-sizes">Attribute sizes</a></caption>
|
|
|
+ <caption><a id="attribute-sizes">属性尺寸</a></caption>
|
|
|
<thead>
|
|
|
<tr>
|
|
|
- <th>GLSL type</th>
|
|
|
- <th>JavaScript type</th>
|
|
|
- <th>Size</th>
|
|
|
+ <th>GLSL 类型</th>
|
|
|
+ <th>JavaScript 类型</th>
|
|
|
+ <th>尺寸</th>
|
|
|
</tr>
|
|
|
</thead>
|
|
|
<tbody>
|
|
|
@@ -243,13 +217,13 @@
|
|
|
</table>
|
|
|
|
|
|
<p>
|
|
|
- Note that attribute buffers are <em>not</em> refreshed automatically when their values change. To update custom attributes,
|
|
|
- set the *needsUpdate* flag to true on the [page:BufferAttribute] of the geometry (see [page:BufferGeometry]
|
|
|
- for further details).
|
|
|
+ 请注意，属性缓冲区 <em>不会</em> 在其值更改时自动刷新。要更新自定义属性，
|
|
|
+ 需要在模型的[page:BufferAttribute]中设置*needsUpdate*为true。
|
|
|
+ （查看[page:BufferGeometry]了解细节）。
|
|
|
</p>
|
|
|
|
|
|
<p>
|
|
|
- To declare a custom [page:Uniform], use the *uniforms* property:
|
|
|
+ 要声明一个自定义的[page:Uniform]，使用*uniforms*属性：
|
|
|
<code>
|
|
|
uniforms: {
|
|
|
time: { value: 1.0 },
|
|
|
@@ -259,34 +233,29 @@
|
|
|
</p>
|
|
|
|
|
|
<p>
|
|
|
- You're recommended to update custom [page:Uniform] values depending on [page:Object3D object] and [page:Camera camera]
|
|
|
- in [page:Object3D.onBeforeRender] because [page:Material] can be shared among [page:Mesh meshes], [page:Matrix4 matrixWorld]
|
|
|
- of [page:Scene] and [page:Camera] are updated in [page:WebGLRenderer.render], and some effects(ex:VREffect) render a [page:Scene scene]
|
|
|
- with private their own [page:Camera cameras].
|
|
|
+ 在[page:Object3D.onBeforeRender]中，建议根据[page:Object3D object]和[page:Camera camera]来更新自定义[page:Uniform]的值。
|
|
|
+ 因为 [page:Material] 可以被[page:Mesh meshes]，[page:Scene]的[page:Matrix4 matrixWorld]以及[page:Camera]共享，
|
|
|
+ 会在[page:WebGLRenderer.render]中更新，并会对拥有私有[page:Camera cameras]的[page:Scene scene]的渲染造成影响。
|
|
|
</p>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
- <h2>Constructor</h2>
|
|
|
+ <h2>构造函数(Constructor)</h2>
|
|
|
|
|
|
<h3>[name]( [param:Object parameters] )</h3>
|
|
|
- <p>
|
|
|
- [page:Object parameters] - (optional) an object with one or more properties defining the material's appearance.
|
|
|
- Any property of the material (including any property inherited from [page:Material]) can be passed in here.
|
|
|
+ <p> [page:Object parameters] - (可选)用于定义材质外观的对象，具有一个或多个属性。
|
|
|
+ 材质的任何属性都可以从此处传入(包括从[page:Material]继承的任何属性)。
|
|
|
</p>
|
|
|
|
|
|
- <h2>Properties</h2>
|
|
|
- <p>See the base [page:Material] class for common properties.</p>
|
|
|
+ <h2>属性(Properties)</h2>
|
|
|
+ <p>常用属性请参见基类[page:Material]。</p>
|
|
|
|
|
|
<h3>[property:Boolean clipping]</h3>
|
|
|
- <p>
|
|
|
- Defines whether this material supports clipping; true to let the renderer pass the clippingPlanes uniform. Default is false.
|
|
|
+ <p> 定义此材质是否支持剪裁; 如果渲染器传递clippingPlanes uniform，则为true。默认值为false。
|
|
|
</p>
|
|
|
|
|
|
<h3>[property:Object defaultAttributeValues]</h3>
|
|
|
- <p>
|
|
|
- When the rendered geometry doesn't include these attributes but the material does,
|
|
|
- these default values will be passed to the shaders. This avoids errors when buffer data is missing.
|
|
|
+ <p> 当渲染的几何体不包含这些属性但材质包含这些属性时，这些默认值将传递给shaders。这可以避免在缓冲区数据丢失时出错。
|
|
|
|
|
|
<code>
|
|
|
this.defaultAttributeValues = {
|
|
|
@@ -300,26 +269,22 @@ this.defaultAttributeValues = {
|
|
|
|
|
|
|
|
|
<h3>[property:Object defines]</h3>
|
|
|
- <p>
|
|
|
- Defines custom constants using *#define* directives within the GLSL code for both the
|
|
|
- vertex shader and the fragment shader; each key/value pair yields another directive:
|
|
|
+ <p> 使用 *#define* 指令在GLSL代码为顶点着色器和片段着色器定义自定义常量；每个键/值对产生另一行定义语句：
|
|
|
<code>
|
|
|
defines: {
|
|
|
FOO: 15,
|
|
|
BAR: true
|
|
|
}
|
|
|
</code>
|
|
|
- yields the lines
|
|
|
+ 这将在GLSL代码中产生如下定义语句：
|
|
|
<code>
|
|
|
#define FOO 15
|
|
|
#define BAR true
|
|
|
</code>
|
|
|
- in the GLSL code.
|
|
|
</p>
|
|
|
|
|
|
<h3>[property:Object extensions]</h3>
|
|
|
- <p>
|
|
|
- An object with the following properties:
|
|
|
+ <p> 一个有如下属性的对象：
|
|
|
<code>
|
|
|
this.extensions = {
|
|
|
derivatives: false, // set to use derivatives
|
|
|
@@ -332,138 +297,114 @@ this.extensions = {
|
|
|
|
|
|
|
|
|
<h3>[property:Boolean fog]</h3>
|
|
|
- <p>
|
|
|
- Define whether the material color is affected by global fog settings; true to pass
|
|
|
- fog uniforms to the shader. Default is false.
|
|
|
+ <p> 定义材质颜色是否受全局雾设置的影响; 如果将fog uniforms传递给shader，则为true。默认值为false。
|
|
|
</p>
|
|
|
|
|
|
|
|
|
<h3>[property:String fragmentShader]</h3>
|
|
|
<p>
|
|
|
- Fragment shader GLSL code. This is the actual code for the shader. In the example above,
|
|
|
- the *vertexShader* and *fragmentShader* code is extracted from the DOM; it could be passed
|
|
|
- as a string directly or loaded via AJAX instead.
|
|
|
+ 片元着色器的GLSL代码。这是shader程序的实际代码。在上面的例子中，
|
|
|
+ *vertexShader* 和 *fragmentShader* 代码是从DOM（HTML文档）中获取的；
|
|
|
+ 它也可以作为一个字符串直接传递或者通过AJAX加载。
|
|
|
</p>
|
|
|
|
|
|
<h3>[property:String index0AttributeName]</h3>
|
|
|
- <p>
|
|
|
- If set, this calls [link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/bindAttribLocation gl.bindAttribLocation]
|
|
|
- to bind a generic vertex index to an attribute variable.
|
|
|
- Default is undefined.
|
|
|
+ <p> 如果设置，则调用[link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/bindAttribLocation gl.bindAttribLocation]
|
|
|
+ 将通用顶点索引绑定到属性变量。默认值未定义。
|
|
|
|
|
|
</p>
|
|
|
|
|
|
<h3>[property:Boolean isShaderMaterial]</h3>
|
|
|
- <p>
|
|
|
- Used to check whether this or derived classes are shader materials. Default is *true*.<br /><br />
|
|
|
-
|
|
|
- You should not change this, as it used internally for optimisation.
|
|
|
+ <p> 用于检查此类或派生类是否为着色器材质。默认值为 *true*。<br /><br />
|
|
|
+ 因为其通常用在内部优化，所以不应该更改该属性值。
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h3>[property:Boolean lights]</h3>
|
|
|
- <p>
|
|
|
- Defines whether this material uses lighting; true to pass uniform data related to lighting to this shader. Default is false.
|
|
|
+ <p> 材质是否受到光照的影响。默认值为 *false*。如果传递与光照相关的uniform数据到这个材质，则为true。默认是false。
|
|
|
</p>
|
|
|
|
|
|
<h3>[property:Float linewidth]</h3>
|
|
|
- <p>Controls wireframe thickness. Default is 1.<br /><br />
|
|
|
-
|
|
|
- Due to limitations of the [link:https://www.khronos.org/registry/OpenGL/specs/gl/glspec46.core.pdf OpenGL Core Profile]
|
|
|
- with the [page:WebGLRenderer WebGL] renderer on most platforms linewidth will
|
|
|
- always be 1 regardless of the set value.
|
|
|
+ <p>控制线框宽度。默认值为1。<br /><br />
|
|
|
+ 由于[link:https://www.khronos.org/registry/OpenGL/specs/gl/glspec46.core.pdf OpenGL Core Profile]与
|
|
|
+ 大多数平台上的[page:WebGLRenderer WebGL]渲染器的限制，无论如何设置该值，线宽始终为1。
|
|
|
</p>
|
|
|
|
|
|
|
|
|
<h3>[property:Boolean morphTargets]</h3>
|
|
|
- <p>
|
|
|
- Defines whether the material uses morphTargets; true morphTarget attributes to this shader
|
|
|
+ <p> 定义材质是否使用 morphTargets。如果将morphTarget attributes传递到此shader，则为true。
|
|
|
</p>
|
|
|
|
|
|
<h3>[property:boolean morphNormals]</h3>
|
|
|
- <p>
|
|
|
- Defines whether the material uses morphNormals. Set as true to pass morphNormal attributes from the [page:Geometry]
|
|
|
- to the shader. Default is *false*.
|
|
|
+ <p> 定义材质是否使用 morphNormals。设置为true，将从[page:Geometry]传递morphNormal属性给shader。默认值是*false*。
|
|
|
</p>
|
|
|
|
|
|
|
|
|
<h3>[property:WebGLProgram program]</h3>
|
|
|
- <p>
|
|
|
- The compiled shader program associated with this material, generated by [page:WebGLRenderer].
|
|
|
- You should not need to access this property.
|
|
|
+ <p> 与此材质相关联的编译后的shader程序，由[page:WebGLRenderer]生成。您应该不需要访问此属性。
|
|
|
</p>
|
|
|
|
|
|
<h3>[property:Boolean flatShading]</h3>
|
|
|
- <p>
|
|
|
- Define whether the material is rendered with flat shading. Default is false.
|
|
|
+ <p> 定义材质是否使用平面着色进行渲染。默认值为false。
|
|
|
</p>
|
|
|
|
|
|
|
|
|
<h3>[property:Boolean skinning]</h3>
|
|
|
- <p>
|
|
|
+ <p> 定义材质是否使用蒙皮; 如果将蒙皮属性传递给shader，则为true。默认值为false。
|
|
|
Define whether the material uses skinning; true to pass skinning attributes to the shader. Default is false.
|
|
|
</p>
|
|
|
|
|
|
<h3>[property:Object uniforms]</h3>
|
|
|
- <p>
|
|
|
- An object of the form:
|
|
|
+ <p> 如下形式的对象：
|
|
|
<code>
|
|
|
{ "uniform1": { value: 1.0 }, "uniform2": { value: 2 } }
|
|
|
</code>
|
|
|
- specifying the uniforms to be passed to the shader code; keys are uniform names, values are definitions of the form
|
|
|
+ 指定要传递给shader代码的uniforms；键为uniform的名称，值(value)是如下形式：
|
|
|
<code>
|
|
|
{ value: 1.0 }
|
|
|
</code>
|
|
|
- where *value* is the value of the uniform. Names must match the name of the uniform,
|
|
|
- as defined in the GLSL code. Note that uniforms are refreshed on every frame,
|
|
|
- so updating the value of the uniform will immediately update the value available to the GLSL code.
|
|
|
+ 这里 *value* 是uniform的值。名称必须匹配 uniform 的name，和GLSL代码中的定义一样。
|
|
|
+ 注意，uniforms逐帧被刷新，所以更新uniform值将立即更新GLSL代码中的相应值。
|
|
|
</p>
|
|
|
|
|
|
|
|
|
<h3>[property:Number vertexColors]</h3>
|
|
|
- <p>
|
|
|
- Define how the vertices are colored, by defining how the *colors* attribute gets populated.
|
|
|
- Possible values are [page:Materials THREE.NoColors], [page:Materials THREE.FaceColors] and
|
|
|
- [page:Materials THREE.VertexColors]. Default is THREE.NoColors.
|
|
|
+ <p> 通过定义*colors*属性的生成方式来定义顶点是如何着色的。
|
|
|
+ 可能的值是[page:Materials THREE.NoColors], [page:Materials THREE.FaceColors] 和
|
|
|
+ [page:Materials THREE.VertexColors]。 缺省为 THREE.NoColors。
|
|
|
</p>
|
|
|
|
|
|
<h3>[property:String vertexShader]</h3>
|
|
|
- <p>
|
|
|
- Vertex shader GLSL code. This is the actual code for the shader. In the example above,
|
|
|
- the *vertexShader* and *fragmentShader* code is extracted from the DOM; it could be passed
|
|
|
- as a string directly or loaded via AJAX instead.
|
|
|
+ <p> 顶点着色器的GLSL代码。这是shader程序的实际代码。
|
|
|
+ 在上面的例子中，*vertexShader* 和 *fragmentShader* 代码是从DOM（HTML文档）中获取的；
|
|
|
+ 它也可以作为一个字符串直接传递或者通过AJAX加载。
|
|
|
</p>
|
|
|
|
|
|
<h3>[property:Boolean wireframe]</h3>
|
|
|
- <p>
|
|
|
- Render geometry as wireframe (using GL_LINES instead of GL_TRIANGLES). Default is false (i.e. render as flat polygons).
|
|
|
+ <p> 将几何体渲染为线框(通过GL_LINES而不是GL_TRIANGLES)。默认值为*false*（即渲染为平面多边形）。
|
|
|
</p>
|
|
|
|
|
|
<h3>[property:Float wireframeLinewidth]</h3>
|
|
|
- <p>Controls wireframe thickness. Default is 1.<br /><br />
|
|
|
-
|
|
|
- Due to limitations of the [link:https://www.khronos.org/registry/OpenGL/specs/gl/glspec46.core.pdf OpenGL Core Profile)
|
|
|
- with the [page:WebGLRenderer WebGL] renderer on most platforms linewidth will
|
|
|
- always be 1 regardless of the set value.
|
|
|
+ <p>控制线框宽度。默认值为1。<br /><br />
|
|
|
+ 由于[link:https://www.khronos.org/registry/OpenGL/specs/gl/glspec46.core.pdf OpenGL Core Profile]与
|
|
|
+ 大多数平台上的[page:WebGLRenderer WebGL]渲染器的限制，无论如何设置该值，线宽始终为1。
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
|
|
- <h2>Methods</h2>
|
|
|
+ <h2>方法(Methods)</h2>
|
|
|
<p>See the base [page:Material] class for common methods.</p>
|
|
|
|
|
|
<h3>[method:ShaderMaterial clone]() [param:ShaderMaterial this]</h3>
|
|
|
- <p>
|
|
|
- Generates a shallow copy of this material. Note that the vertexShader and fragmentShader
|
|
|
- are copied <em>by reference</em>, as are the definitions of the *attributes*; this means
|
|
|
- that clones of the material will share the same compiled [page:WebGLProgram]. However, the
|
|
|
- *uniforms* are copied <em>by value</em>, which allows you to have different sets of uniforms
|
|
|
- for different copies of the material.
|
|
|
+ <p> 创建该材料的一个浅拷贝。需要注意的是，vertexShader和fragmentShader使用<em>引用拷贝</em>；
|
|
|
+ *attributes*的定义也是如此;
|
|
|
+ 这意味着，克隆的材料将共享相同的编译[page:WebGLProgram]；
|
|
|
+ 但是，*uniforms* 是 <em>值拷贝</em>，这样对不同的材料我们可以有不同的uniforms变量。
|
|
|
</p>
|
|
|
|
|
|
- <h2>Source</h2>
|
|
|
+ <h2>源码(Source)</h2>
|
|
|
|
|
|
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
|
|
|
</body>
|
duanjobs