Skip to content

Commit 0870665

Browse files
mrdoobmrdoob
committed
Added boundingSphere check for Meshes in Ray ( improving performance considerably).
1 parent 699bbb7 commit 0870665

11 files changed

+682
-659
lines changed

‎build/Three.js

Lines changed: 323 additions & 323 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎build/custom/ThreeCanvas.js

Lines changed: 77 additions & 77 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎build/custom/ThreeDOM.js

Lines changed: 27 additions & 27 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎build/custom/ThreeSVG.js

Lines changed: 46 additions & 46 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎build/custom/ThreeWebGL.js

Lines changed: 128 additions & 128 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎examples/canvas_interactive_cubes.html

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,8 @@
2525
var camera, scene, projector, renderer;
2626
var particleMaterial;
2727

28+
var objects = [];
29+
2830
init();
2931
animate();
3032

@@ -63,6 +65,8 @@
6365
object.rotation.z = ( Math.random() * 360 ) * Math.PI / 180;
6466
scene.addObject( object );
6567

68+
objects.push( object );
69+
6670
}
6771

6872
var PI2 = Math.PI * 2;
@@ -105,7 +109,7 @@
105109

106110
var ray = new THREE.Ray( camera.position, vector.subSelf( camera.position ).normalize() );
107111

108-
var intersects = ray.intersectScene( scene );
112+
var intersects = ray.intersectObjects( objects );
109113

110114
if ( intersects.length > 0 ) {
111115

‎examples/canvas_interactive_particles.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -68,12 +68,12 @@
6868

6969
scene = new THREE.Scene();
7070

71-
for ( var i = 0; i < 500; i ++ ) {
71+
for ( var i = 0; i < 100; i ++ ) {
7272

7373
var particle = new THREE.Particle( new THREE.ParticleCanvasMaterial( { color: Math.random() * 0x808008 + 0x808080, program: programStroke } ) );
74-
particle.position.x = Math.random() * 2000 - 1000;
75-
particle.position.y = Math.random() * 2000 - 1000;
76-
particle.position.z = Math.random() * 2000 - 1000;
74+
particle.position.x = Math.random() * 800 - 400;
75+
particle.position.y = Math.random() * 800 - 400;
76+
particle.position.z = Math.random() * 800 - 400;
7777
particle.scale.x = particle.scale.y = Math.random() * 10 + 10;
7878
scene.addObject( particle );
7979

‎examples/canvas_interactive_voxelpainter.html

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -210,8 +210,6 @@
210210

211211
var intersects = ray.intersectScene( scene );
212212

213-
// console.log( intersects );
214-
215213
if ( intersects.length > 0 ) {
216214

217215
if ( intersects[ 0 ].face != rollOveredFace ) {

‎examples/webgl_interactive_cubes_tween.html renamed to ‎examples/webgl_interactive_cubes.html

Lines changed: 43 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,6 @@
1616

1717
<script type="text/javascript" src="../build/Three.js"></script>
1818

19-
<script type="text/javascript" src="js/Tween.js"></script>
2019
<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
2120
<script type="text/javascript" src="js/Stats.js"></script>
2221

@@ -25,6 +24,8 @@
2524
var container, stats;
2625
var camera, scene, projector, renderer;
2726

27+
var mouse = { x: 0, y: 0 }, INTERSECTED;
28+
2829
init();
2930
animate();
3031

@@ -61,27 +62,28 @@
6162
light.position.normalize();
6263
scene.addLight( light );
6364

64-
var geometry = new THREE.Cube( 100, 100, 100 );
65+
var geometry = new THREE.Cube( 20, 20, 20 );
6566

66-
for ( var i = 0; i < 20; i ++ ) {
67+
for ( var i = 0; i < 500; i ++ ) {
6768

6869
var object = new THREE.Mesh( geometry, new THREE.MeshLambertMaterial( { color: Math.random() * 0xffffff } ) );
6970
object.position.x = Math.random() * 800 - 400;
7071
object.position.y = Math.random() * 800 - 400;
7172
object.position.z = Math.random() * 800 - 400;
72-
object.scale.x = Math.random() * 2 + 1;
73-
object.scale.y = Math.random() * 2 + 1;
74-
object.scale.z = Math.random() * 2 + 1;
7573
object.rotation.x = ( Math.random() * 360 ) * Math.PI / 180;
7674
object.rotation.y = ( Math.random() * 360 ) * Math.PI / 180;
7775
object.rotation.z = ( Math.random() * 360 ) * Math.PI / 180;
76+
object.scale.x = Math.random() * 2 + 1;
77+
object.scale.y = Math.random() * 2 + 1;
78+
object.scale.z = Math.random() * 2 + 1;
7879
scene.addObject( object );
7980

8081
}
8182

8283
projector = new THREE.Projector();
8384

8485
renderer = new THREE.WebGLRenderer();
86+
renderer.sortObjects = false;
8587
renderer.setSize( window.innerWidth, window.innerHeight );
8688

8789
container.appendChild(renderer.domElement);
@@ -91,45 +93,17 @@
9193
stats.domElement.style.top = '0px';
9294
container.appendChild( stats.domElement );
9395

94-
document.addEventListener( 'mousedown', onDocumentMouseDown, false );
96+
document.addEventListener( 'mousemove', onDocumentMouseMove, false );
9597

9698
}
9799

98-
function onDocumentMouseDown( event ) {
100+
function onDocumentMouseMove( event ) {
99101

100102
event.preventDefault();
101103

102-
var vector = new THREE.Vector3( ( event.clientX / window.innerWidth ) * 2 - 1, - ( event.clientY / window.innerHeight ) * 2 + 1, 0.5 );
103-
projector.unprojectVector( vector, camera );
104+
mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
105+
mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
104106

105-
var ray = new THREE.Ray( camera.position, vector.subSelf( camera.position ).normalize() );
106-
107-
var intersects = ray.intersectScene( scene );
108-
109-
if ( intersects.length > 0 ) {
110-
111-
new TWEEN.Tween( intersects[ 0 ].object.position ).to( {
112-
x: Math.random() * 800 - 400,
113-
y: Math.random() * 800 - 400,
114-
z: Math.random() * 800 - 400 }, 2000 )
115-
.easing( TWEEN.Easing.Elastic.EaseOut).start();
116-
117-
new TWEEN.Tween( intersects[ 0 ].object.rotation ).to( {
118-
x: ( Math.random() * 360 ) * Math.PI / 180,
119-
y: ( Math.random() * 360 ) * Math.PI / 180,
120-
z: ( Math.random() * 360 ) * Math.PI / 180 }, 2000 )
121-
.easing( TWEEN.Easing.Elastic.EaseOut).start();
122-
123-
}
124-
125-
/*
126-
// Parse all the faces
127-
for ( var i in intersects ) {
128-
129-
intersects[ i ].face.material[ 0 ].color.setHex( Math.random() * 0xffffff | 0x80000000 );
130-
131-
}
132-
*/
133107
}
134108

135109
//
@@ -148,13 +122,42 @@
148122

149123
function render() {
150124

151-
TWEEN.update();
152-
153125
theta += 0.2;
154126
camera.position.x = radius * Math.sin( theta * Math.PI / 360 );
155127
camera.position.y = radius * Math.sin( theta * Math.PI / 360 );
156128
camera.position.z = radius * Math.cos( theta * Math.PI / 360 );
157129

130+
// find intersections
131+
132+
camera.update();
133+
134+
var vector = new THREE.Vector3( mouse.x, mouse.y, 0.5 );
135+
projector.unprojectVector( vector, camera );
136+
137+
var ray = new THREE.Ray( camera.position, vector.subSelf( camera.position ).normalize() );
138+
139+
var intersects = ray.intersectScene( scene );
140+
141+
if ( intersects.length > 0 ) {
142+
143+
if ( INTERSECTED != intersects[ 0 ].object ) {
144+
145+
if ( INTERSECTED ) INTERSECTED.materials[ 0 ].color.setHex( INTERSECTED.currentHex );
146+
147+
INTERSECTED = intersects[ 0 ].object;
148+
INTERSECTED.currentHex = INTERSECTED.materials[ 0 ].color.hex;
149+
INTERSECTED.materials[ 0 ].color.setHex( 0xff0000 );
150+
151+
}
152+
153+
} else {
154+
155+
if ( INTERSECTED ) INTERSECTED.materials[ 0 ].color.setHex( INTERSECTED.currentHex );
156+
157+
INTERSECTED = null;
158+
159+
}
160+
158161
renderer.render( scene, camera );
159162

160163
}

‎src/core/Geometry.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -388,7 +388,9 @@ THREE.Geometry.prototype = {
388388

389389
computeBoundingSphere: function () {
390390

391-
var radius = this.boundingSphere === null ? 0 : this.boundingSphere.radius;
391+
// var radius = this.boundingSphere === null ? 0 : this.boundingSphere.radius;
392+
393+
var radius = 0;
392394

393395
for ( var v = 0, vl = this.vertices.length; v < vl; v ++ ) {
394396

‎src/core/Ray.js

Lines changed: 26 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -38,25 +38,37 @@ THREE.Ray.prototype = {
3838

3939
if ( object instanceof THREE.Particle ) {
4040

41-
var intersects = [],
42-
distance = distanceFromIntersection( this.origin, this.direction, object );
41+
var distance = distanceFromIntersection( this.origin, this.direction, object );
4342

44-
if ( distance && distance < object.scale.x ) {
43+
if ( ! distance || distance > object.scale.x ) {
4544

46-
intersects.push( {
45+
return [];
4746

48-
distance: distance,
49-
point: object.position,
50-
object: object
47+
}
5148

52-
} );
49+
return [ {
5350

54-
}
51+
distance: distance,
52+
point: object.position,
53+
face: null,
54+
object: object
5555

56-
return intersects;
56+
} ];
5757

5858
} else if ( object instanceof THREE.Mesh ) {
5959

60+
// Checking boundingSphere
61+
62+
var distance = distanceFromIntersection( this.origin, this.direction, object );
63+
64+
if ( ! distance || distance > object.geometry.boundingSphere.radius * Math.max( object.scale.x, Math.max( object.scale.y, object.scale.z ) ) ) {
65+
66+
return [];
67+
68+
}
69+
70+
// Checking faces
71+
6072
var f, fl, face, a, b, c, d, normal,
6173
dot, scalar,
6274
origin, direction,
@@ -130,6 +142,10 @@ THREE.Ray.prototype = {
130142

131143
return intersects;
132144

145+
} else {
146+
147+
return [];
148+
133149
}
134150

135151
function distanceFromIntersection( origin, direction, object ) {

0 commit comments

Comments
 (0)