Skip to content

T
three.js

Ablesons / three.js
与 Fork 源项目一致

从无法访问的项目Fork

通知 2
Star 0
Fork 0
T
three.js

体验新版 GitCode，发现更多精彩内容 >>

切换分支/标签
查找文件 普通视图历史永久链接Permalink
Raycaster.html 7.1 KB
Newer Older
N
commit first en-zh version  
nicholas 已提交
1 2 3 4 5 6 7 8 9 10 11 12 13 
<!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>

		<p class="desc">
Z
commit all core part translation，first commit  
zhaojunb 已提交
14 15 16 
			该类被设计为 [link:https://en.wikipedia.org/wiki/Ray_casting raycasting] 类的帮助类。射线检测用于帮助判断用户鼠标
			在3D空间内选择的物体具体是哪个。（通过检测从摄像机到视锥近平面上鼠标点连线发出的射线，位于3D空间内哪个物体上，从而判断当前
			用户的选择）。
N
commit first en-zh version  
nicholas 已提交
17 18 
		</p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
19 
		<h2>示例</h2>
N
commit first en-zh version  
nicholas 已提交
20 21 22 23 24 25 
		<code>
		var raycaster = new THREE.Raycaster();
		var mouse = new THREE.Vector2();

		function onMouseMove( event ) {
Z
commit all core part translation，first commit  
zhaojunb 已提交
26 
			// 将鼠标位置归一化为设备坐标。x 和 y 方向的取值范围是 (-1 to +1)
N
commit first en-zh version  
nicholas 已提交
27 28 29 30 31 32 33 34 

			mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
			mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;

		}

		function render() {
Z
commit all core part translation，first commit  
zhaojunb 已提交
35 
			// 通过摄像机和鼠标位置更新射线
N
commit first en-zh version  
nicholas 已提交
36 37 
			raycaster.setFromCamera( mouse, camera );
Z
commit all core part translation，first commit  
zhaojunb 已提交
38 
			// 计算物体和射线的焦点
N
commit first en-zh version  
nicholas 已提交
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 
			var intersects = raycaster.intersectObjects( scene.children );

			for ( var i = 0; i < intersects.length; i++ ) {

				intersects[ i ].object.material.color.set( 0xff0000 );

			}

			renderer.render( scene, camera );

		}

		window.addEventListener( 'mousemove', onMouseMove, false );

		window.requestAnimationFrame(render);

		</code>
		<div>
			Examples: [example:webgl_interactive_cubes Raycasting to a Mesh]<br />
			[example:webgl_interactive_cubes_ortho Raycasting to a Mesh in using an OrthographicCamera]<br />
			[example:webgl_interactive_buffergeometry Raycasting to a Mesh with BufferGeometry]<br />
			[example:webgl_interactive_lines Raycasting to a Line]<br />
			[example:webgl_interactive_raycasting_points Raycasting to Points]<br />
			[example:webgl_geometry_terrain_raycast Terrain raycasting]<br />
			[example:webgl_octree_raycasting Raycasting using an octree]<br />
			[example:webgl_interactive_voxelpainter Raycasting to paint voxels]<br />
			[example:webgl_raycast_texture Raycast to a Texture]
		</div>


		<p>
		</p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
73 
		<h2>构造函数</h2>
N
commit first en-zh version  
nicholas 已提交
74 75 76 77 78 79 80 81 82 

		<h3>[name]( [param:Vector3 origin], [param:Vector3 direction], [param:Float near], [param:Float far] ) {</h3>
		<p>
		[page:Vector3 origin] — The origin vector where the ray casts from.<br />
		[page:Vector3 direction] — The direction vector that gives direction to the ray. Should be normalized.<br />
		[page:Float near] — All results returned are further away than near. Near can't be negative. Default value is 0.<br />
		[page:Float far] — All results returned are closer than far. Far can't be lower than near. Default value is Infinity.
		</p>
		<p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
83 
			该方法构造一个新的射线对象。<br />
N
commit first en-zh version  
nicholas 已提交
84 85 86 
		</p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
87 
		<h2>属性</h2>
N
commit first en-zh version  
nicholas 已提交
88 89 90 

		<h3>[property:float far]</h3>
		<p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
91 92 
			射线的 far 参数。该参数决定射线最远可达范围，超过 far 的物体在检测时可以忽略。
			该值不能为负，且应该大于 near 参数。
N
commit first en-zh version  
nicholas 已提交
93 94 95 96 
		</p>

		<h3>[property:float linePrecision]</h3>
		<p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
97 
			当与物体焦时，射线当精确度。
N
commit first en-zh version  
nicholas 已提交
98 99 100 101 
		</p>

		<h3>[property:float near]</h3>
		<p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
102 103 
			射线的 near 参数。该参数决定射线的最近距离，近于 near 的物体在检测时可以忽略。
			该值不能为负，且应该小于 far 参数。
N
commit first en-zh version  
nicholas 已提交
104 105 106 107 
		</p>

		<h3>[property:Object params]</h3>
		<p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
108 
			该对象拥有如下属性：
N
commit first en-zh version  
nicholas 已提交
109 110 111 112 113 114 115 116 117 118 119 120 121 122 

			<code>
{
	Mesh: {},
	Line: {},
	LOD: {},
	Points: { threshold: 1 },
	Sprite: {}
}
			</code>

		</p>

		<h3>[property:Ray ray]</h3>
Z
commit all core part translation，first commit  
zhaojunb 已提交
123 
		<p> 射线检测时用到的 [Page:Ray]。</p>
N
commit first en-zh version  
nicholas 已提交
124 125
Z
commit all core part translation，first commit  
zhaojunb 已提交
126 
		<h2>方法</h2>
N
commit first en-zh version  
nicholas 已提交
127 128 129 

		<h3>[method:null set]( [param:Vector3 origin], [param:Vector3 direction] )</h3>
		<p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
130 131 
		[page:Vector3 origin] — 射线的起点坐标。<br />
		[page:Vector3 direction] — 射线的方向向量，该向量需要被归一化。
N
commit first en-zh version  
nicholas 已提交
132 133 
		</p>
		<p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
134 
			用参数规定的原点和方向更新射线数据。
N
commit first en-zh version  
nicholas 已提交
135 136 137 138 
		</p>

		<h3>[method:null setFromCamera]( [param:Vector2 coords], [param:Camera camera] )</h3>
		<p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
139 140 
		[page:Vector2 coords] — 鼠标的被归一化的 2D 坐标（Normalized Device Coordinate）。X 和 Y 的值都应该components should be between -1 and 1。<br />
		[page:Camera camera] — 射线应该以哪个摄像机作为原点。
N
commit first en-zh version  
nicholas 已提交
141 142 
		</p>
		<p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
143 
			用参数规定的新原点和方向更新射线数据。
N
commit first en-zh version  
nicholas 已提交
144 145 146 147 
		</p>

		<h3>[method:Array intersectObject]( [param:Object3D object], [param:Boolean recursive], [param:Array optionalTarget] )</h3>
		<p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
148 149 150 
		[page:Object3D object] — 用于检测与射线焦的物体。<br />
		[page:Boolean recursive] — 如果设置为 true, 该方法同样检测所有的子对象与射线的相焦情况。否则，值检测参数指定的物体。默认值为 false。<br />
		[page:Array optionalTarget] — (可选) 结果存储到指定对象。否则，一个新的队列 [page:Array] 将会被实例化。如果设置了该值, 在调用该函数前，需要清空队列(例如, array.length = 0;)。
N
commit first en-zh version  
nicholas 已提交
151 152 
		</p>
		<p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
153 
			检查对象和射线的所有焦点，如果 recursive 设置为 true，同样检查子对象。焦点结果被保存在队列中，按照焦点的距离排序，最近结果最先返回。
N
commit first en-zh version  
nicholas 已提交
154 155 156 157 158 
		</p>
		<code>
				[ { distance, point, face, faceIndex, object }, ... ]
		</code>
		<p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
159 160 161 162 163 164 
			[page:Float distance] – 射线原点到焦点的距离<br />
			[page:Vector3 point] – 世界坐标下的焦点位置<br />
			[page:Face3 face] – 与射线相交的位置<br />
			[page:Integer faceIndex] – 与射线相交的面的索引<br />
			[page:Object3D object] – 与射线相交的对象<br />
			[page:Vector2 uv] - 与射线相交点的物体的 U,V 坐标
N
commit first en-zh version  
nicholas 已提交
165 166 
		</p>
		<p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
167 
		*Raycaster* 当计算射线是否与对象相交时，会代理到对象的 [page:Object3D.raycast raycast] 方法。该方法允许 [page:Mesh meshes] 对射线检测的响应与 [page:Line lines] 和 [page:Points pointclouds] 不同。
N
commit first en-zh version  
nicholas 已提交
168 169 
		</p>
		<p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
170 
		*Note* 对于被检测的 mesh 的面，其必须朝向 检测射线 [page:.ray ray] 的原点, 否则该面会被忽略。如果想要射线检测到 mesh 中朝向原点和背向原点的面，你需要设置 [page:Mesh.material material] 的 [page:Material.side side] 属性为 *THREE.DoubleSide*。
N
commit first en-zh version  
nicholas 已提交
171 172 173 174 
		</p>

		<h3>[method:Array intersectObjects]( [param:Array objects], [param:Boolean recursive], [param:Array optionalTarget] )</h3>
		<p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
175 176 177 
		[page:Array objects] — 需要被检测是否与射线碰撞的物体的队列<br />
		[page:Boolean recursive] — 如果为 true, 检测时除指定对象外，也会递归检测所有子对象。 默认值为 false。<br />
		[page:Array optionalTarget] — (可选)结果存储到指定对象。否则，一个新的队列 [page:Array] 将会被实例化。如果设置了该值, 在调用该函数前，需要清空队列(例如, array.length = 0;)。
N
commit first en-zh version  
nicholas 已提交
178 179 
		</p>
		<p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
180 
			检查参数队列中的所有对象和当前射线的所有焦点，如果 recursive 设置为 true，同样检查子对象。焦点结果被保存在队列中，按照焦点的距离排序，最近结果最先返回。
N
commit first en-zh version  
nicholas 已提交
181 182 
		</p>
Z
commit all core part translation，first commit  
zhaojunb 已提交
183 
		<h2>资源</h2>
N
commit first en-zh version  
nicholas 已提交
184 185 186 187 

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