Skip to content

T
three.js

车家大少爷 / three.js
与 Fork 源项目一致

从无法访问的项目Fork

通知 2
Star 0
Fork 0
T
three.js

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

提交 11b1b9a2 编写于 作者: M Mr.doob
浏览文件
操作

Improved daydream and gearvr examples.

上级 eb8f8464
隐藏空白更改
内联 并排
Showing with 40 addition and 78 deletion
examples/webvr_daydream.html
浏览文件 @ 11b1b9a2
......@@ -31,13 +31,11 @@
var clock = new THREE.Clock();
var container;
var camera, scene, ray, raycaster, renderer;
var camera, scene, renderer;
var controller;
var room;
var INTERSECTED;
init();
animate();
......@@ -54,13 +52,8 @@
info.innerHTML = '<a href="https://threejs.org" target="_blank" rel="noopener">three.js</a> webvr - daydream';
container.appendChild( info );
var background = new THREE.CubeTextureLoader()
.setPath( 'textures/cube/MilkyWay/' )
.load( [ 'dark-s_px.jpg', 'dark-s_nx.jpg', 'dark-s_py.jpg', 'dark-s_ny.jpg', 'dark-s_pz.jpg', 'dark-s_nz.jpg' ] );
background.format = THREE.RGBFormat;
scene = new THREE.Scene();
scene.background = background;
scene.background = new THREE.Color( 0x505050 );
camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 0.1, 10 );
......@@ -77,7 +70,7 @@
light.position.set( 1, 1, 1 ).normalize();
scene.add( light );
var geometry = new THREE.BoxGeometry( 0.15, 0.15, 0.15 );
var geometry = new THREE.IcosahedronGeometry( 0.08, 2 );
for ( var i = 0; i < 200; i ++ ) {
......@@ -91,10 +84,6 @@
object.rotation.y = Math.random() * 2 * Math.PI;
object.rotation.z = Math.random() * 2 * Math.PI;
object.scale.x = Math.random() + 0.5;
object.scale.y = Math.random() + 0.5;
object.scale.z = Math.random() + 0.5;
object.userData.velocity = new THREE.Vector3();
object.userData.velocity.x = Math.random() * 0.01 - 0.005;
object.userData.velocity.y = Math.random() * 0.01 - 0.005;
......@@ -106,10 +95,6 @@
//
raycaster = new THREE.Raycaster();
//
renderer = new THREE.WebGLRenderer( { antialias: true } );
renderer.setPixelRatio( window.devicePixelRatio );
renderer.setSize( window.innerWidth, window.innerHeight );
......@@ -128,16 +113,10 @@
//
var controllerHelper = new THREE.Line( new THREE.BufferGeometry(), new THREE.LineBasicMaterial( { linewidth: 4 } ) );
var controllerHelper = new THREE.Line( new THREE.BufferGeometry(), new THREE.LineBasicMaterial( { linewidth: 2 } ) );
controllerHelper.geometry.addAttribute( 'position', new THREE.Float32BufferAttribute( [ 0, 0, 0, 0, 0, - 10 ], 3 ) );
controller.add( controllerHelper );
renderer.domElement.addEventListener( 'click', function ( event ) {
controllerHelper.material.color.setHex( Math.random() * 0xffffff );
} );
//
window.addEventListener( 'resize', onWindowResize, false );
......@@ -173,66 +152,44 @@
room.remove( cube );
cube.position.copy( controller.position ).sub( room.position );
cube.userData.velocity.x = ( Math.random() - 0.5 ) * 0.02 * delta;
cube.userData.velocity.y = ( Math.random() - 0.5 ) * 0.02 * delta;
cube.userData.velocity.z = ( Math.random() * 0.01 - 0.05 ) * delta;
cube.userData.velocity.x = ( Math.random() - 0.5 ) * 0.02;
cube.userData.velocity.y = ( Math.random() - 0.5 ) * 0.02;
cube.userData.velocity.z = ( Math.random() * 0.02 - 0.1 );
cube.userData.velocity.applyQuaternion( controller.quaternion );
room.add( cube );
}
// find intersections
raycaster.ray.origin.copy( controller.position );
raycaster.ray.direction.set( 0, 0, - 1 ).applyQuaternion( controller.quaternion );
var intersects = raycaster.intersectObjects( room.children );
if ( intersects.length > 0 ) {
if ( INTERSECTED != intersects[ 0 ].object ) {
if ( INTERSECTED ) INTERSECTED.material.emissive.setHex( INTERSECTED.currentHex );
INTERSECTED = intersects[ 0 ].object;
INTERSECTED.currentHex = INTERSECTED.material.emissive.getHex();
INTERSECTED.material.emissive.setHex( 0xff0000 );
}
} else {
if ( INTERSECTED ) INTERSECTED.material.emissive.setHex( INTERSECTED.currentHex );
INTERSECTED = undefined;
}
// keep cubes inside room
var range = 3 - 0.04;
for ( var i = 0; i < room.children.length; i ++ ) {
var cube = room.children[ i ];
cube.position.add( cube.userData.velocity );
if ( cube.position.x < - 3 || cube.position.x > 3 ) {
if ( cube.position.x < - range || cube.position.x > range ) {
cube.position.x = THREE.Math.clamp( cube.position.x, - 3, 3 );
cube.position.x = THREE.Math.clamp( cube.position.x, - range, range );
cube.userData.velocity.x = - cube.userData.velocity.x;
}
if ( cube.position.y < - 3 || cube.position.y > 3 ) {
if ( cube.position.y < - range ) {
cube.position.y = Math.max( cube.position.y, - range );
cube.position.y = THREE.Math.clamp( cube.position.y, - 3, 3 );
cube.userData.velocity.y = - cube.userData.velocity.y;
cube.userData.velocity.x *= 0.9;
cube.userData.velocity.y = - cube.userData.velocity.y * 0.8;
cube.userData.velocity.z *= 0.9;
}
if ( cube.position.z < - 3 || cube.position.z > 3 ) {
if ( cube.position.z < - range || cube.position.z > range ) {
cube.position.z = THREE.Math.clamp( cube.position.z, - 3, 3 );
cube.position.z = THREE.Math.clamp( cube.position.z, - range, range );
cube.userData.velocity.z = - cube.userData.velocity.z;
}
......@@ -241,6 +198,8 @@
cube.rotation.y += cube.userData.velocity.y * 2 * delta;
cube.rotation.z += cube.userData.velocity.z * 2 * delta;
cube.userData.velocity.y -= 0.00098;
}
renderer.render( scene, camera );
......
examples/webvr_gearvr.html
浏览文件 @ 11b1b9a2
......@@ -34,7 +34,7 @@
var clock = new THREE.Clock();
var container;
var camera, camBox, scene, renderer;
var camera, scene, renderer;
var controller;
var room;
......@@ -73,7 +73,7 @@
light.position.set( 1, 1, 1 ).normalize();
scene.add( light );
var geometry = new THREE.BoxGeometry( 0.2, 0.2, 0.2 );
var geometry = new THREE.IcosahedronGeometry( 0.08, 2 );
for ( var i = 0; i < 200; i ++ ) {
......@@ -90,10 +90,6 @@
object.rotation.y = Math.random() * 2 * Math.PI;
object.rotation.z = Math.random() * 2 * Math.PI;
object.scale.x = Math.random() + 0.5;
object.scale.y = Math.random() + 0.5;
object.scale.z = Math.random() + 0.5;
object.userData.velocity = new THREE.Vector3();
object.userData.velocity.x = Math.random() * 0.01 - 0.005;
object.userData.velocity.y = Math.random() * 0.01 - 0.005;
......@@ -181,9 +177,9 @@
room.remove( cube );
cube.position.copy( controller.position ).sub( room.position );
cube.userData.velocity.x = ( Math.random() - 0.5 ) * 0.02 * delta;
cube.userData.velocity.y = ( Math.random() - 0.5 ) * 0.02 * delta;
cube.userData.velocity.z = ( Math.random() * 0.01 - 0.05 ) * delta;
cube.userData.velocity.x = ( Math.random() - 0.5 ) * 0.02;
cube.userData.velocity.y = ( Math.random() - 0.5 ) * 0.02;
cube.userData.velocity.z = ( Math.random() * 0.01 - 0.1 );
cube.userData.velocity.applyQuaternion( controller.quaternion );
room.add( cube );
......@@ -191,29 +187,34 @@
// keep cubes inside room
var range = 3 - 0.04;
for ( var i = 0; i < room.children.length; i ++ ) {
var cube = room.children[ i ];
cube.position.add( cube.userData.velocity );
if ( cube.position.x < - 3 || cube.position.x > 3 ) {
if ( cube.position.x < - range || cube.position.x > range ) {
cube.position.x = THREE.Math.clamp( cube.position.x, - 3, 3 );
cube.position.x = THREE.Math.clamp( cube.position.x, - range, range );
cube.userData.velocity.x = - cube.userData.velocity.x;
}
if ( cube.position.y < - 3 || cube.position.y > 3 ) {
if ( cube.position.y < - range || cube.position.y > range ) {
cube.position.y = THREE.Math.clamp( cube.position.y, - 3, 3 );
cube.userData.velocity.y = - cube.userData.velocity.y;
cube.position.y = Math.max( cube.position.y, - range );
cube.userData.velocity.x *= 0.9;
cube.userData.velocity.y = - cube.userData.velocity.y * 0.8;
cube.userData.velocity.z *= 0.9;
}
if ( cube.position.z < - 3 || cube.position.z > 3 ) {
if ( cube.position.z < - range || cube.position.z > range ) {
cube.position.z = THREE.Math.clamp( cube.position.z, - 3, 3 );
cube.position.z = THREE.Math.clamp( cube.position.z, - range, range );
cube.userData.velocity.z = - cube.userData.velocity.z;
}
......@@ -222,6 +223,8 @@
cube.rotation.y += cube.userData.velocity.y * 2 * delta;
cube.rotation.z += cube.userData.velocity.z * 2 * delta;
cube.userData.velocity.y -= 0.00098;
}
renderer.render( scene, camera );
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或