File: Textures.html

package info (click to toggle)
three.js 111%2Bdfsg1-2
  • links: PTS, VCS
  • area: main
  • in suites: bullseye
  • size: 15,184 kB
  • sloc: javascript: 133,174; makefile: 24; sh: 1
file content (260 lines) | stat: -rw-r--r-- 11,156 bytes parent folder | download | duplicates (2)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="utf-8" />
	<base href="../../../" />
	<script src="list.js"></script>
	<script src="page.js"></script>
	<link type="text/css" rel="stylesheet" href="page.css" />
</head>

<body>
	<h1>材质常量(Texture Constants)</h1>

	<h2>映射模式</h2>
	<code>
		THREE.UVMapping
		THREE.CubeReflectionMapping
		THREE.CubeRefractionMapping
		THREE.EquirectangularReflectionMapping
		THREE.EquirectangularRefractionMapping
		THREE.SphericalReflectionMapping
		THREE.CubeUVReflectionMapping
		THREE.CubeUVRefractionMapping
		</code>

	<p>
		这些常量定义了纹理贴图的映射模式。<br />
		[page:Constant UVMapping]是默认值,纹理使用网格的坐标来进行映射。<br /><br />
		其它的值定义了环境映射的类型。<br /><br />

		[page:Constant CubeReflectionMapping] 和 [page:Constant CubeRefractionMapping] 用于 [page:CubeTexture CubeTexture] ——
		由6个纹理组合而成,每个纹理都是立方体的一个面。

		对于[page:CubeTexture CubeTexture]来说,[page:Constant CubeReflectionMapping]是其默认值。<br /><br />

		[page:Constant EquirectangularReflectionMapping] 和 [page:Constant EquirectangularRefractionMapping]
		用于等距圆柱投影的环境贴图,也被叫做经纬线映射贴图。等距圆柱投影贴图表示沿着其水平中线360°的视角,以及沿着其垂直轴向180°的视角。贴图顶部和底部的边缘分别对应于它所映射的球体的北极和南极。
		<br /><br />

		[page:Constant SphericalReflectionMapping] 用球形反射贴图,例如它可以通过剪裁镜面球的照片来获得。
		无论摄像机相对于立方贴图对象或者表面的位置时怎样的,球形贴图被渲染时将会“面朝”摄像机。<br /><br />

		请查看示例:[example:webgl_materials_envmaps materials / envmaps] 。
	</p>


	<h2>包裹模式</h2>
	<code>
		THREE.RepeatWrapping
		THREE.ClampToEdgeWrapping
		THREE.MirroredRepeatWrapping
		</code>
	<p>
		这些常量定义了纹理贴图的 [page:Texture.wrapS wrapS] 和 [page:Texture.wrapT wrapT] 属性,定义了水平和垂直方向上纹理的包裹方式。
		<br /><br />

		使用[page:constant RepeatWrapping],纹理将简单地重复到无穷大。
		With [page:constant RepeatWrapping] the texture will simply repeat to infinity.<br /><br />

		[page:constant ClampToEdgeWrapping]是默认值,纹理中的最后一个像素将延伸到网格的边缘。<br /><br />

		使用[page:constant MirroredRepeatWrapping], 纹理将重复到无穷大,在每次重复时将进行镜像。
	</p>

	<h2>放大滤镜(Magnification Filters)</h2>
	<code>
		THREE.NearestFilter
		THREE.LinearFilter
		</code>

	<p>
		这些常量用于纹理的[page:Texture.magFilter magFilter]属性,它们定义了当被纹理化的像素映射到小于或者等于1纹理元素(texel)的区域时,将要使用的纹理放大函数。<br /><br />

		[page:constant NearestFilter]返回与指定纹理坐标(在曼哈顿距离之内)最接近的纹理元素的值。<br /><br />
		[page:constant LinearFilter]是默认值,返回距离指定的纹理坐标最近的四个纹理元素的加权平均值,
		并且可以包含纹理的其他部分中,被包裹或者被重复的项目,具体取决于 [page:Texture.wrapS wrapS] 和 [page:Texture.wrapT wrapT] 的值,and on the exact mapping。

	</p>

	<h2>缩小滤镜(Minification Filters)</h2>
	<code>
		THREE.NearestFilter
		THREE.NearestMipmapNearestFilter
		THREE.NearestMipmapLinearFilter
		THREE.LinearFilter
		THREE.LinearMipmapNearestFilter
		THREE.LinearMipmapLinearFilter
	</code>

	<p>
		这些常量用于纹理的[page:Texture.minFilter minFilter]属性,它们定义了当被纹理化的像素映射到大于1纹理元素(texel)的区域时,将要使用的纹理缩小函数。<br /><br />

		除了[page:constant NearestFilter] 和 [page:constant LinearFilter],
		下面的四个函数也可以用于缩小:<br /><br />

		[page:constant NearestMipmapNearestFilter]选择与被纹理化像素的尺寸最匹配的mipmap,
		并以[page:constant NearestFilter](最靠近像素中心的纹理元素)为标准来生成纹理值。
		<br /><br />

		[page:constant NearestMipmapLinearFilter]选择与被纹理化像素的尺寸最接近的两个mipmap,
		并以[page:constant NearestFilter]为标准来从每个mipmap中生成纹理值。最终的纹理值是这两个值的加权平均值。
		<br /><br />

		[page:constant LinearMipmapNearestFilter]选择与被纹理化像素的尺寸最匹配的mipmap,
		并以[page:constant LinearFilter](最靠近像素中心的四个纹理元素的加权平均值)为标准来生成纹理值。
		<br /><br />

		[page:constant LinearMipmapLinearFilter]是默认值,它选择与被纹理化像素的尺寸最接近的两个mipmap,
		并以[page:constant LinearFilter]为标准来从每个mipmap中生成纹理值。最终的纹理值是这两个值的加权平均值。<br /><br />

		请查看示例:[example:webgl_materials_texture_filters materials / texture / filters]。
	</p>

	<h2>类型</h2>
	<code>
		THREE.UnsignedByteType
		THREE.ByteType
		THREE.ShortType
		THREE.UnsignedShortType
		THREE.IntType
		THREE.UnsignedIntType
		THREE.FloatType
		THREE.HalfFloatType
		THREE.UnsignedShort4444Type
		THREE.UnsignedShort5551Type
		THREE.UnsignedShort565Type
		THREE.UnsignedInt248Type
		</code>
	<p>
		这些常量用于纹理的[page:Texture.type type]属性,这些属性必须与正确的格式相对应。详情请查看下方。<br /><br />

		[page:constant UnsignedByteType] 是默认值。
	</p>

	<h2>格式</h2>
	<code>
		THREE.AlphaFormat
		THREE.RGBFormat
		THREE.RGBAFormat
		THREE.LuminanceFormat
		THREE.LuminanceAlphaFormat
		THREE.RGBEFormat
		THREE.DepthFormat
		THREE.DepthStencilFormat
		</code>
	<p>
		这些常量用于纹理的[page:Texture.format format]属性,它们定义了shader(着色器)将如何读取的2D纹理或者*texels*(纹理元素)的元素。.<br /><br />

		[page:constant AlphaFormat] 丢弃红、绿、蓝分量,仅读取Alpha分量。<br /><br />

		[page:constant RGBFormat] 丢弃Alpha分量,仅读取红、绿、蓝分量。<br /><br />

		[page:constant RGBAFormat] 是默认值,它将读取红、绿、蓝和Alpha分量。<br /><br />


		[page:constant LuminanceFormat] 将每个元素作为单独的亮度分量来读取。
		将其转换为范围限制在[0,1]区间的浮点数,然后通过将亮度值放入红、绿、蓝通道,并将1.0赋给Alpha通道,来组装成一个RGBA元素。<br /><br />


		[page:constant LuminanceAlphaFormat] 将每个元素同时作为亮度分量和Alpha分量来读取。
		和上面[page:constant LuminanceFormat]的处理过程是一致的,除了Alpha分量具有除了*1.0*以外的值。<br /><br />

		[page:constant RGBEFormat] 与 [page:constant RGBAFormat] 是相同的。<br /><br />

		[page:constant DepthFormat]将每个元素作为单独的深度值来读取,将其转换为范围限制在[0,1]区间的浮点数。
		它是[page:DepthTexture DepthTexture]的默认值。<br /><br />

		[page:constant DepthStencilFormat]将每个元素同时作为一对深度值和模板值来读取。
		其中的深度分量解释为[page:constant DepthFormat]。
		模板分量基于深度+模板的内部格式来进行解释。

		<br /><br />
		请注意,纹理必须具有正确的[page:Texture.type type]设置,正如上一节所描述的那样。
		请参阅[link:https://developer.mozilla.org/en/docs/Web/API/WebGLRenderingContext/texImage2D WebGLRenderingContext.texImage2D]
		来获得有关详细信息。
	</p>

	<h2>DDS / ST3C 压缩纹理格式</h2>
	<code>
		THREE.RGB_S3TC_DXT1_Format
		THREE.RGBA_S3TC_DXT1_Format
		THREE.RGBA_S3TC_DXT3_Format
		THREE.RGBA_S3TC_DXT5_Format
		</code>
	<p>
		要使用[page:CompressedTexture CompressedTexture]中的[page:Texture.format format]属性,
		需要获得[link:https://www.khronos.org/registry/webgl/extensions/WEBGL_compressed_texture_s3tc/ WEBGL_compressed_texture_s3tc]
		扩展的支持。<br /><br />

		通过这个扩展,这里的四种[link:https://en.wikipedia.org/wiki/S3_Texture_Compression S3TC]格式将可以使用:<br />

		[page:constant RGB_S3TC_DXT1_Format]:RGB图像格式的DXT1压缩图像。
		[page:constant RGBA_S3TC_DXT1_Format]:RGB图像格式的DXT1压缩图像,Alpha仅具有是/否透明两个值。<br />
		[page:constant RGBA_S3TC_DXT3_Format]:RGBA图像格式的DXT3压缩图像,和32位RGBA纹理贴图相比,它提供了4:1的压缩比。<br />
		[page:constant RGBA_S3TC_DXT5_Format]:RGBA图像格式的DXT5压缩图像,它也提供了4:1的压缩比,但与DX3格式的不同之处在于其Alpha是如何被压缩的。<br />
	</p>

	<h2>PVRTC 压缩纹理格式(PVRTC Compressed Texture Formats)</h2>
	<code>
		THREE.RGB_PVRTC_4BPPV1_Format
		THREE.RGB_PVRTC_2BPPV1_Format
		THREE.RGBA_PVRTC_4BPPV1_Format
		THREE.RGBA_PVRTC_2BPPV1_Format
		</code>
	<p>
		要使用[page:CompressedTexture CompressedTexture]中的[page:Texture.format format]属性,需要获得
		[link:https://www.khronos.org/registry/webgl/extensions/WEBGL_compressed_texture_pvrtc/ WEBGL_compressed_texture_pvrtc]
		扩展的支持。<br />
		PVRTC通常只在具有PowerVR芯片的移动设备上可用,这些设备主要是苹果设备。<br /><br />


		通过这个扩展,这里的四种[link:https://en.wikipedia.org/wiki/PVRTC PVRTC]格式将可以使用:<br />

		[page:constant RGB_PVRTC_4BPPV1_Format]:4位模式下的RGB压缩,每4x4像素一个块。<br />
		[page:constant RGB_PVRTC_2BPPV1_Format]:2位模式下的RGB压缩,每8x4像素一个块。<br />
		[page:constant RGBA_PVRTC_4BPPV1_Format]: 4位模式下的RGBA压缩,每4x4像素一个块。<br />
		[page:constant RGBA_PVRTC_2BPPV1_Format]: 2位模式下的RGB压缩,每8x4像素一个块。<br />
	</p>

	<h2>ETC 压缩纹理格式</h2>
	<code>
		THREE.RGB_ETC1_Format
		</code>
	<p>
		要使用[page:CompressedTexture CompressedTexture]中的[page:Texture.format format]属性,需要获得
		[link:https://www.khronos.org/registry/webgl/extensions/WEBGL_compressed_texture_etc1/ WEBGL_compressed_texture_etc1]
		扩展的支持。<br /><br />
	</p>

	<h2>编码</h2>
	<code>
		THREE.LinearEncoding
		THREE.sRGBEncoding
		THREE.GammaEncoding
		THREE.RGBEEncoding
		THREE.LogLuvEncoding
		THREE.RGBM7Encoding
		THREE.RGBM16Encoding
		THREE.RGBDEncoding
		THREE.BasicDepthPacking
		THREE.RGBADepthPacking
		</code>
	<p>
		这些常量用于纹理的[page:Texture.encoding encoding]属性。<br /><br />

		如果编码类型在纹理已被一个材质使用之后发生了改变,
		你需要来设置[page:Material.needsUpdate Material.needsUpdate]为*true*来使得材质重新编译。<br /><br />

		[page:constant LinearEncoding]是默认值。
		除此之外的其他值仅在材质的贴图、envMap和emissiveMap中有效。
	</p>

	<h2>源代码</h2>
	<p>
		[link:https://github.com/mrdoob/three.js/blob/master/src/constants.js src/constants.js]
	</p>
</body>

</html>