File: Geometry.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 (338 lines) | stat: -rw-r--r-- 14,091 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
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
<!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>[name]</h1>

		<div class="desc">
		<p>
			Geometry 是一个便于用户使用的 [page:BufferGeometry] 的替代品。Geometry 利用 [page:Vector3]
			或 [page:Color] 存储了几何体的相关 attributes(如顶点位置,面信息,颜色等)比起 BufferGeometry
			更容易读写,但是运行效率不如有类型的队列。
		</p>
		<p>
		对于大型工程或正式工程,推荐采用 [page:BufferGeometry]。
		</p>
		</div>

		<h2>示例</h2>

		<div>[example:webgl_geometry_minecraft WebGL / geometry / minecraft ]</div>
		<div>[example:webgl_geometry_minecraft_ao WebGL / geometry / minecraft / ao ]</div>
		<div>[example:webgl_geometry_nurbs WebGL / geometry / nurbs ]</div>
		<div>[example:webgl_geometry_spline_editor WebGL / geometry / spline / editor ]</div>
		<div>[example:webgl_interactive_cubes_gpu WebGL / interactive / cubes / gpu ]</div>
		<div>[example:webgl_interactive_lines WebGL / interactive / lines ]</div>
		<div>[example:webgl_interactive_raycasting_points WebGL / interactive / raycasting / points ]</div>
		<div>[example:webgl_interactive_voxelpainter WebGL / interactive / voxelpainter ]</div>
		<div>[example:webgl_morphnormals WebGL / morphNormals ]</div>


		<code>var geometry = new THREE.Geometry();

		geometry.vertices.push(
			new THREE.Vector3( -10,  10, 0 ),
			new THREE.Vector3( -10, -10, 0 ),
			new THREE.Vector3(  10, -10, 0 )
		);

		geometry.faces.push( new THREE.Face3( 0, 1, 2 ) );

		geometry.computeBoundingSphere();
		</code>

		<h2>构造函数</h2>


		<h3>[name]()</h3>
		<p>
		构造函数没有任何参数。
		</p>


		<h2>属性</h2>

		<h3>[property:Box3 boundingBox]</h3>
		<p>
			Geometry 的外边界矩形,可以通过 [page:.computeBoundingBox]() 进行计算,默认值是 *null*。
		</p>

		<h3>[property:Sphere boundingSphere]</h3>
		<p>
			Geometry 的外边界球形,可以通过 [page:.computeBoundingSphere]() 进行计算,默认值是 *null*。
		</p>

		<h3>[property:Array colors]</h3>
		<p>
			顶点 [page:Color colors] 队列,与顶点数量和顺序保持一致。<br /><br />

			该属性用于 [page:Points] 、 [page:Line] 或派生自 [page:LineSegments] 的类。
			对于 [page:Mesh Meshes],请使用 [page:Face3.vertexColors] 函数。<br /><br />

			如果要标记队列中的数据已经更新,[page:Geometry Geometry.colorsNeedUpdate] 值需要被设置为 true。
		</p>

		<h3>[property:Array faces]</h3>
		<p>
			[page:Face3 faces] 队列。<br />

			描述每个顶点之间如何组成模型面的面队列。同时该队列保存面和顶点的法向量和颜色信息。<br /><br />
			如果要标记队列中的数据已经更新,[page:Geometry Geometry.elementsNeedUpdate] 值需要被设置为 true。
		</p>

		<h3>[property:Array faceVertexUvs]</h3>
		<p>
			面的 [link:https://en.wikipedia.org/wiki/UV_mapping UV] 层的队列,该队列用于将纹理和几何信息进行映射。<br />
			每个 UV 层都是一个 [page:UV] 的队列,顺序和数量同面中的顶点相对用。<br /><br />
			如果要标记队列中的数据已经更新,[page:Geometry Geometry.uvsNeedUpdate] 值需要被设置为 true。
		</p>

		<h3>[property:Integer id]</h3>
		<p>当前 geometry 实例的唯一标识符的数。</p>

		<h3>[property:Boolean isGeometry]</h3>
		<p>
			用于判断当前类或派生类属于 Geometries。默认值是 *true*。<br /><br />

			你不应该改变该值,该值用于内部优化。
		</p>

		<h3>[property:array lineDistances]</h3>
		<p>
			用于保存线型几何体中每个顶点间距离的。在正确渲染 [page:LineDashedMaterial] 时,需要用到该数据。
		</p>

		<h3>[property:Array morphTargets]</h3>
		<p>
			[link:https://en.wikipedia.org/wiki/Morph_target_animation morph targets] 的队列。每个
			morph target 都是一个如下的 javascript 对象:
		<code>{ name: "targetName", vertices: [ new THREE.Vector3(), ... ] }</code>
			Morph 顶点和几何体原始顶点在数量和顺序上需要一一对应。
		</p>

		<h3>[property:Array morphNormals]</h3>
		<p>
			一个 morph 法向量的数组。Morph 法向量和 morph target 有类似的结构,每个法向量都是一个如下的 Javascript 对象:
		<code>morphNormal = { name: "NormalName", normals: [ new THREE.Vector3(), ... ] }</code>

			示例详见 [example:webgl_morphnormals WebGL / morphNormals]。
		</p>

		<h3>[property:String name]</h3>
		<p>当前几何的可选别名。默认值是一个空字符串。</p>

		<h3>[property:Array skinWeights]</h3>
		<p>
			当在处理一个 [page:SkinnedMesh] 时,每个顶点最多可以有 4 个相关的 [page:Bone bones] 来影响它。
			skinWeights 属性是一个权重队列,顺序同几何体中的顶点保持一致。因而,队列中的第一个 skinWeight
			就对应几何体中的第一个顶点。由于每个顶点可以被 4 个 [page:Bone bones] 营销,因而每个顶点的 skinWeights
			就采用一个 [page:Vector4] 表示。
		</p>
		<p>
			skinWeight 矢量中每个元素的取值范围应该在 0 到 1 之间。例如,当设置为 0,骨骼对该顶点的位置没有影响。当设置为 0.5,
			则对顶点的影响为 50%。 当设置为 100% 则对顶点的影响是 100%。如果矢量中只有一个骨骼与顶点相关联,则你只需要关注矢量中的第一个元素,
			剩余的元素可以忽略,他们的值可以都设置为 0。
		</p>

		<h3>[property:Array skinIndices]</h3>
		<p>
			就如同 skinWeights 属性一样。skinWeights 的值也是与几何体的顶点相对应。每个顶点可以最多有 4 个骨骼与之相关联。
			因而第一个 skinIndex 就与几何体的第一个顶点相关联,skinIndex 的值就指明了影响该顶点的骨骼是哪个。例如,第一个顶点的值是
			<strong>( 10.05, 30.10, 12.12 )</strong>,第一个 skinIndex 的值是<strong>( 10, 2, 0, 0 )</strong>,第一个 skinWeight
			的值是 <strong>( 0.8, 0.2, 0, 0 )</strong>。上述值表明第一个顶点受到<strong>mesh.bones[10]</strong>骨骼的影响有 80%,
			受到 <strong>skeleton.bones[2]</strong> 的影响是 20%,由于另外两个 skinWeight 的值是 0,因而他们对顶点没有任何影响。
		</p>
		<p>
			下面以代码的形式展示示例:
		<code>
		// 例如
		geometry.skinIndices[15] = new THREE.Vector4(   0,   5,   9, 10 );
		geometry.skinWeights[15] = new THREE.Vector4( 0.2, 0.5, 0.3,  0 );

		// 与该顶点相关
		geometry.vertices[15];

		// 相应骨骼可以这样被调用:
		skeleton.bones[0]; // weight of 0.2
		skeleton.bones[5]; // weight of 0.5
		skeleton.bones[9]; // weight of 0.3
		skeleton.bones[10]; // weight of 0
		</code>
		</p>

		<h3>[property:String uuid]</h3>
		<p>
			当前对象实例的 [link:http://en.wikipedia.org/wiki/Universally_unique_identifier UUID]。
			该值会被自动分配,请不要修改它。
		</p>

		<h3>[property:Array vertices]</h3>
		<p>
			[page:Vector3 vertices] 的队列。<br />
			顶点的队列,保存了模型中每个顶点的位置信息。<br />
			如果要标记队列中的数据已经更新,[page:.verticesNeedUpdate] 值需要被设置为 true。
		</p>

		<h3>[property:Boolean verticesNeedUpdate]</h3>
		<p> 如果顶点队列中的数据被修改,该值需要被设置为 *true*。</p>

		<h3>[property:Boolean elementsNeedUpdate]</h3>
		<p> 如果面队列中的数据被修改,该值需要被设置为 *true*。</p>

		<h3>[property:Boolean uvsNeedUpdate]</h3>
		<p> 如果 UV 队列中的数据被修改,该值需要被设置为 *true*。</p>

		<h3>[property:Boolean normalsNeedUpdate]</h3>
		<p> 如果法向量队列中的数据被修改,该值需要被设置为 *true*。</p>

		<h3>[property:Boolean colorsNeedUpdate]</h3>
		<p> 如果颜色队列或 face3 的颜色数据被修改,该值需要被设置为 *true*。</p>

		<h3>[property:Boolean groupsNeedUpdate]</h3>
		<p> 如果 face3 的 materialIndex 被修改,该值需要被设置为 *true*。</p>

		<h3>[property:Boolean lineDistancesNeedUpdate]</h3>
		<p> 如果 linedistances 队列中的数据被修改,该值需要被设置为 *true*。</p>


		<h2>方法</h2>

		<h3>[page:EventDispatcher EventDispatcher] 该类中可用的函数。</h3>

		<h3>[method:null applyMatrix]( [param:Matrix4 matrix] )</h3>
		<p> 将矩阵信息直接应用于几何体顶点坐标。</p>

		<h3>[method:Geometry center] ()</h3>
		<p> 基于外边界矩形将几何体居中。</p>

		<h3>[method:Geometry clone]()</h3>
		<p>克隆当前几何体。<br /><br />
			该方法除几何体的顶点、面信息和 UV 外不会复制其他属性。
		</p>

		<h3>[method:null computeBoundingBox]()</h3>
		<p> 计算当前几何体的外边界矩形。该方法会更新 [page:Geometry Geometry.boundingBox] 属性值。</p>

		<h3>[method:null computeBoundingSphere]()</h3>
		<p> 计算当前几何体的外边界球。该方法会更新 [page:Geometry Geometry.boundingSphere] 属性值。</p>

		<p>
			计算外边界矩形或外边界球并不是默认会自动调用的方法,这两个函数需要被显示的调用才能天得到相应属性值,否则对应属性值保持默认值 *null*。
		</p>

		<h3>[method:null computeFaceNormals]()</h3>
		<p> 计算 [page:Face3.normal face normals] 值。</p>

		<h3>[method:null computeFlatVertexNormals]()</h3>
		<p> 计算 flat [page:Face3.vertexNormals vertex normals] 值。
			该方法会将顶点法向量的值赋值为相应面的法向量值。</p>

		<h3>[method:null computeMorphNormals]()</h3>
		<p> 计算 [page:.morphNormals] 值。</p>

		<h3>[method:null computeVertexNormals]( [param:Boolean areaWeighted] )</h3>
		<p>
		areaWeighted - 如果该值设置为 true,则每个面的法向量对顶点法向量的影响按照面的面积大小来计算。默认值为 true.<br /><br />

			通过周围面的法向量计算顶点的法向量。
		</p>

		<h3>[method:Geometry copy]( [param:Geometry geometry] )</h3>
		<p>
			将参数代表的几何体的顶点、面和 UV 复制到当前几何体。该方法不会复制除此以外的别的属性值。
		</p>

		<h3>[method:null dispose]()</h3>
		<p>
			将对象从内存中删除。 <br />

			在你删除一个几何体时,不要忘记调用该方法,否则会造成内存泄漏。
		</p>

		<h3>[method:Geometry fromBufferGeometry]( [param:BufferGeometry geometry] )</h3>
		<p> 将一个 [page:BufferGeometry] 对象,转换成一个 Geometry 对象。</p>

		<h3>[method:Geometry lookAt] ( [param:Vector3 vector] )</h3>
		<p>
			vector - 当前几何体朝向的世界坐标。<br /><br />

			该方法将几何体进行旋转,是的几何体朝向参数指定的世界坐标。该方法一般在一次处理中完成,但不在渲染过程中执行。<br>
			一般使用 [page:Object3D.lookAt] 方法进行实时更改。
		</p>

		<h3>[method:null merge]( [param:Geometry geometry], [param:Matrix4 matrix], [param:Integer materialIndexOffset] )</h3>
		<p> 将两个几何体,或一个几何体和一个从对象中通过变换获得的几何体进行合并。</p>

		<h3>[method:null mergeMesh]( [param:Mesh mesh] )</h3>
		<p> 将参数指定的面片信息与当前几何体进行合并。同样会使用到参数 mesh 的变换。</p>


		<h3>[method:null mergeVertices]()</h3>
		<p>
			通过 hashmap 检查重复的顶点。<br />
			重复的顶点将会被移除,面的顶点信息会被更新。
		</p>

		<h3>[method:null normalize]()</h3>
		<p>
			将当前几何体归一化。 <br />
			将当前几何体居中,并且使得该几何体的外边界球半径为 *1.0*。
		</p>

		<h3>[method:Geometry rotateX] ( [param:Float radians] )</h3>
		<p>
			将几何体绕 X 轴旋转参数指定度数。该操作通常在一次处理中完成,但不会在渲染过程中处理。<br>
			使用 [page:Object3D.rotation] 对模型面片进行实时旋转处理。
		</p>

		<h3>[method:Geometry rotateY] ( [param:Float radians] )</h3>
		<p>
			将几何体绕 Y 轴旋转参数指定度数。该操作通常在一次处理中完成,但不会在渲染过程中处理。<br>
			使用 [page:Object3D.rotation] 对模型面片进行实时旋转处理。
		</p>

		<h3>[method:Geometry rotateZ] ( [param:Float radians] )</h3>
		<p>
			将几何体绕 Z 轴旋转参数指定度数。该操作通常在一次处理中完成,但不会在渲染过程中处理。<br>
			使用 [page:Object3D.rotation] 对模型面片进行实时旋转处理。
		</p>

		<h3>[method:Geometry setFromPoints] ( [param:Array points] )</h3>
		<p>通过点队列设置一个 Geometry 中的顶点。</p>

		<h3>[method:null sortFacesByMaterialIndex] (  )</h3>
		<p>
			通过材质索引对面队列进行排序。对于复杂且有多个材质的几何体,该操作可以有效减少 draw call 从而提升性能。
		</p>

		<h3>[method:Geometry scale] ( [param:Float x], [param:Float y], [param:Float z] )</h3>
		<p>
			缩放几何体大小。该操作通常在一次处理中完成,但不会在渲染过程中处理。<br>
			使用 [page:Object3D.scale] 对模型面片进行实时缩放处理。
		</p>

		<h3>[method:JSON toJSON] ( )</h3>
		<p> 将 Geometry 对象转为  JSON 格式。<br />
			将几何体转换为 three.js [link:https://github.com/mrdoob/three.js/wiki/JSON-Object-Scene-format-4 JSON Object/Scene format](three.js JSON 物体/场景格式)。
		</p>

		<h3>[method:Geometry translate] ( [param:Float x], [param:Float y], [param:Float z] )</h3>
		<p>
			移动当前几何体。该操作通常在一次处理中完成,但不会在渲染过程中处理。<br>
			使用 [page:Object3D.position] 对模型面片进行实时移动处理。
		</p>


		<h2>源代码</h2>

		<p>
			[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
		</p>
	</body>
</html>