javascript
/
three.js
огледало от https://github.com/tazdij/three.js.git


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333
							<!DOCTYPE html>
<html lang="zh">
	<head>
		<meta charset="utf-8" />
		<base href="../../../" />
		<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>

		<code>
		const 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>

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

		<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: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 applyMatrix4]( [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>