Skip to content

T
three.js

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

从无法访问的项目Fork

通知 2
Star 0
Fork 0
T
three.js

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

未验证 提交 fb3fb58c 编写于 作者: M Mr.doob 提交者： GitHub
浏览文件
操作

Merge pull request #14843 from looeee/examples_car_controls 

Examples: update webgl_materials_cars
上级 35d1b5b2 64146263
展开全部 隐藏空白更改
内联 并排
Showing with 521 addition and 1827 deletion
examples/files.js
浏览文件 @ fb3fb58c
......@@ -149,7 +149,6 @@ var files = {
"webgl_materials_cubemap_balls_reflection",
"webgl_materials_cubemap_balls_refraction",
"webgl_materials_cubemap_dynamic",
"webgl_materials_cubemap_dynamic2",
"webgl_materials_cubemap_refraction",
"webgl_materials_curvature",
"webgl_materials_displacementmap",
......
examples/js/Car.js
浏览文件 @ fb3fb58c
/**
* @author alteredq / http://alteredqualia.com/
* @author Lewy Blue https://github.com/looeee
*
* The model is expected to follow real world car proportions. You can try unusual car types
* but your results may be unexpected. Scaled models are also not supported.
*
* Defaults are rough estimates for a real world scale car model
*
*/
THREE.Car = function () {
THREE.Car = ( function ( ) {
var scope = this;
// private variables
var steeringWheelSpeed = 1.5;
var maxSteeringRotation = 0.6;
// car geometry manual parameters
var acceleration = 0;
this.modelScale = 1;
var maxSpeedReverse, accelerationReverse, deceleration;
this.backWheelOffset = 2;
var controlKeys = { LEFT: 37, UP: 38, RIGHT: 39, DOWN: 40, BRAKE: 32 };
this.autoWheelGeometry = true;
var wheelOrientation = 0;
var carOrientation = 0;
// car geometry parameters automatically set from wheel mesh
// - assumes wheel mesh is front left wheel in proper global
// position with respect to body mesh
// - other wheels are mirrored against car root
// - if necessary back wheels can be offset manually
var root = null;
this.wheelOffset = new THREE.Vector3();
var frontLeftWheelRoot = null;
var frontRightWheelRoot = null;
this.wheelDiameter = 1;
var frontLeftWheel = new THREE.Group();
var frontRightWheel = new THREE.Group();
var backLeftWheel = null;
var backRightWheel = null;
// car "feel" parameters
var steeringWheel = null;
this.MAX_SPEED = 2200;
this.MAX_REVERSE_SPEED = - 1500;
var wheelDiameter = 1;
var length = 1;
this.MAX_WHEEL_ROTATION = 0.6;
var loaded = false;
this.FRONT_ACCELERATION = 1250;
this.BACK_ACCELERATION = 1500;
var controls = {
this.WHEEL_ANGULAR_ACCELERATION = 1.5;
this.FRONT_DECCELERATION = 750;
this.WHEEL_ANGULAR_DECCELERATION = 1.0;
this.STEERING_RADIUS_RATIO = 0.0023;
this.MAX_TILT_SIDES = 0.05;
this.MAX_TILT_FRONTBACK = 0.015;
// internal control variables
this.speed = 0;
this.acceleration = 0;
this.wheelOrientation = 0;
this.carOrientation = 0;
// car rigging
this.root = new THREE.Object3D();
this.frontLeftWheelRoot = new THREE.Object3D();
this.frontRightWheelRoot = new THREE.Object3D();
this.bodyMesh = null;
this.frontLeftWheelMesh = null;
this.frontRightWheelMesh = null;
this.backLeftWheelMesh = null;
this.backRightWheelMesh = null;
this.bodyGeometry = null;
this.wheelGeometry = null;
this.bodyMaterials = null;
this.wheelMaterials = null;
// internal helper variables
this.loaded = false;
this.meshes = [];
// API
this.enableShadows = function ( enable ) {
for ( var i = 0; i < this.meshes.length; i ++ ) {
this.meshes[ i ].castShadow = enable;
this.meshes[ i ].receiveShadow = enable;
}
};
this.setVisible = function ( enable ) {
for ( var i = 0; i < this.meshes.length; i ++ ) {
this.meshes[ i ].visible = enable;
this.meshes[ i ].visible = enable;
}
};
this.loadPartsJSON = function ( bodyURL, wheelURL ) {
var loader = new THREE.JSONLoader();
loader.load( bodyURL, function( geometry, materials ) {
createBody( geometry, materials )
} );
loader.load( wheelURL, function( geometry, materials ) {
createWheels( geometry, materials )
} );
};
this.loadPartsBinary = function ( bodyURL, wheelURL ) {
var loader = new THREE.BinaryLoader();
loader.load( bodyURL, function( geometry, materials ) {
createBody( geometry, materials )
} );
loader.load( wheelURL, function( geometry, materials ) {
createWheels( geometry, materials )
} );
brake: false,
moveForward: false,
moveBackward: false,
moveLeft: false,
moveRight: false
};
this.updateCarModel = function ( delta, controls ) {
// speed and wheels based on controls
function Car( maxSpeed, acceleration, brakePower, turningRadius, keys ) {
if ( controls.moveForward ) {
this.enabled = true;
this.speed = THREE.Math.clamp( this.speed + delta * this.FRONT_ACCELERATION, this.MAX_REVERSE_SPEED, this.MAX_SPEED );
this.acceleration = THREE.Math.clamp( this.acceleration + delta, - 1, 1 );
this.elemNames = {
flWheel: 'wheel_fl',
frWheel: 'wheel_fr',
rlWheel: 'wheel_rl',
rrWheel: 'wheel_rr',
steeringWheel: 'steering_wheel', // set to null to disable
};
}
// km/hr
this.maxSpeed = maxSpeed || 180;
maxSpeedReverse = - this.maxSpeed * 0.25;
if ( controls.moveBackward ) {
// m/s
this.acceleration = acceleration || 10;
accelerationReverse = this.acceleration * 0.5;
// metres
this.turningRadius = turningRadius || 6;
this.speed = THREE.Math.clamp( this.speed - delta * this.BACK_ACCELERATION, this.MAX_REVERSE_SPEED, this.MAX_SPEED );
this.acceleration = THREE.Math.clamp( this.acceleration - delta, - 1, 1 );
// m/s
deceleration = this.acceleration * 2;
}
// multiplied with deceleration, so breaking deceleration = ( acceleration * 2 * brakePower ) m/s
this.brakePower = brakePower || 10;
if ( controls.moveLeft ) {
// exposed so that a user can use this for various effect, e.g blur
this.speed = 0;
this.wheelOrientation = THREE.Math.clamp( this.wheelOrientation + delta * this.WHEEL_ANGULAR_ACCELERATION, - this.MAX_WHEEL_ROTATION, this.MAX_WHEEL_ROTATION );
// keys used to control car - by default the arrow keys and space to brake
controlKeys = keys || controlKeys;
}
// local axes of rotation - these are likely to vary between models
this.wheelRotationAxis = 'x';
this.wheelTurnAxis = 'z';
this.steeringWheelTurnAxis = 'y';
if ( controls.moveRight ) {
document.addEventListener( 'keydown', this.onKeyDown, false );
document.addEventListener( 'keyup', this.onKeyUp, false );
this.wheelOrientation = THREE.Math.clamp( this.wheelOrientation - delta * this.WHEEL_ANGULAR_ACCELERATION, - this.MAX_WHEEL_ROTATION, this.MAX_WHEEL_ROTATION );
}
}
Car.prototype = {
// speed decay
constructor: Car,
if ( ! ( controls.moveForward || controls.moveBackward ) ) {
onKeyDown: function ( event ) {
if ( this.speed > 0 ) {
switch ( event.keyCode ) {
var k = exponentialEaseOut( this.speed / this.MAX_SPEED );
case controlKeys.BRAKE:
controls.brake = true;
controls.moveForward = false;
controls.moveBackward = false;
break;
this.speed = THREE.Math.clamp( this.speed - k * delta * this.FRONT_DECCELERATION, 0, this.MAX_SPEED );
this.acceleration = THREE.Math.clamp( this.acceleration - k * delta, 0, 1 );
case controlKeys.UP: controls.moveForward = true; break;
} else {
case controlKeys.DOWN: controls.moveBackward = true; break;
var k = exponentialEaseOut( this.speed / this.MAX_REVERSE_SPEED );
case controlKeys.LEFT: controls.moveLeft = true; break;
this.speed = THREE.Math.clamp( this.speed + k * delta * this.BACK_ACCELERATION, this.MAX_REVERSE_SPEED, 0 );
this.acceleration = THREE.Math.clamp( this.acceleration + k * delta, - 1, 0 );
case controlKeys.RIGHT: controls.moveRight = true; break;
}
},
}
onKeyUp: function ( event ) {
// steering decay
switch ( event.keyCode ) {
if ( ! ( controls.moveLeft || controls.moveRight ) ) {
case controlKeys.BRAKE: controls.brake = false; break;
if ( this.wheelOrientation > 0 ) {
case controlKeys.UP: controls.moveForward = false; break;
this.wheelOrientation = THREE.Math.clamp( this.wheelOrientation - delta * this.WHEEL_ANGULAR_DECCELERATION, 0, this.MAX_WHEEL_ROTATION );
case controlKeys.DOWN: controls.moveBackward = false; break;
} else {
case controlKeys.LEFT: controls.moveLeft = false; break;
this.wheelOrientation = THREE.Math.clamp( this.wheelOrientation + delta * this.WHEEL_ANGULAR_DECCELERATION, - this.MAX_WHEEL_ROTATION, 0 );
case controlKeys.RIGHT: controls.moveRight = false; break;
}
}
// car update
},
var forwardDelta = this.speed * delta;
dispose: function () {
this.carOrientation += ( forwardDelta * this.STEERING_RADIUS_RATIO ) * this.wheelOrientation;
document.removeEventListener( 'keydown', this.onKeyDown, false );
document.removeEventListener( 'keyup', this.onKeyUp, false );
// displacement
},
this.root.position.x += Math.sin( this.carOrientation ) * forwardDelta;
this.root.position.z += Math.cos( this.carOrientation ) * forwardDelta;
update: function ( delta ) {
// steering
if ( ! loaded || ! this.enabled ) return;
this.root.rotation.y = this.carOrientation;
var brakingDeceleration = 1;
// tilt
if ( controls.brake ) brakingDeceleration = this.brakePower;
if ( this.loaded ) {
if ( controls.moveForward ) {
this.bodyMesh.rotation.z = this.MAX_TILT_SIDES * this.wheelOrientation * ( this.speed / this.MAX_SPEED );
this.bodyMesh.rotation.x = - this.MAX_TILT_FRONTBACK * this.acceleration;
this.speed = THREE.Math.clamp( this.speed + delta * this.acceleration, maxSpeedReverse, this.maxSpeed );
acceleration = THREE.Math.clamp( acceleration + delta, - 1, 1 );
}
// wheels rolling
var angularSpeedRatio = 1 / ( this.modelScale * ( this.wheelDiameter / 2 ) );
var wheelDelta = forwardDelta * angularSpeedRatio;
}
if ( this.loaded ) {
if ( controls.moveBackward ) {
this.frontLeftWheelMesh.rotation.x += wheelDelta;
this.frontRightWheelMesh.rotation.x += wheelDelta;
this.backLeftWheelMesh.rotation.x += wheelDelta;
this.backRightWheelMesh.rotation.x += wheelDelta;
this.speed = THREE.Math.clamp( this.speed - delta * accelerationReverse, maxSpeedReverse, this.maxSpeed );
acceleration = THREE.Math.clamp( acceleration - delta, - 1, 1 );
}
}
// front wheels steering
if ( controls.moveLeft ) {
this.frontLeftWheelRoot.rotation.y = this.wheelOrientation;
this.frontRightWheelRoot.rotation.y = this.wheelOrientation;
wheelOrientation = THREE.Math.clamp( wheelOrientation + delta * steeringWheelSpeed, - maxSteeringRotation, maxSteeringRotation );
};
}
// internal helper methods
if ( controls.moveRight ) {
function createBody ( geometry, materials ) {
wheelOrientation = THREE.Math.clamp( wheelOrientation - delta * steeringWheelSpeed, - maxSteeringRotation, maxSteeringRotation );
scope.bodyGeometry = geometry;
scope.bodyMaterials = materials;
}
createCar();
// this.speed decay
if ( ! ( controls.moveForward || controls.moveBackward ) ) {
}
if ( this.speed > 0 ) {
function createWheels ( geometry, materials ) {
var k = exponentialEaseOut( this.speed / this.maxSpeed );
scope.wheelGeometry = geometry;
scope.wheelMaterials = materials;
this.speed = THREE.Math.clamp( this.speed - k * delta * deceleration * brakingDeceleration, 0, this.maxSpeed );
acceleration = THREE.Math.clamp( acceleration - k * delta, 0, 1 );
createCar();
} else {
}
var k = exponentialEaseOut( this.speed / maxSpeedReverse );
function createCar () {
this.speed = THREE.Math.clamp( this.speed + k * delta * accelerationReverse * brakingDeceleration, maxSpeedReverse, 0 );
acceleration = THREE.Math.clamp( acceleration + k * delta, - 1, 0 );
if ( scope.bodyGeometry && scope.wheelGeometry ) {
}
// compute wheel geometry parameters
}
if ( scope.autoWheelGeometry ) {
// steering decay
if ( ! ( controls.moveLeft || controls.moveRight ) ) {
scope.wheelGeometry.computeBoundingBox();
if ( wheelOrientation > 0 ) {
var bb = scope.wheelGeometry.boundingBox;
wheelOrientation = THREE.Math.clamp( wheelOrientation - delta * steeringWheelSpeed, 0, maxSteeringRotation );
scope.wheelOffset.addVectors( bb.min, bb.max );
scope.wheelOffset.multiplyScalar( 0.5 );
} else {
scope.wheelDiameter = bb.max.y - bb.min.y;
wheelOrientation = THREE.Math.clamp( wheelOrientation + delta * steeringWheelSpeed, - maxSteeringRotation, 0 );
scope.wheelGeometry.center();
}
}
// rig the car
var s = scope.modelScale,
delta = new THREE.Vector3();
var bodyFaceMaterial = scope.bodyMaterials;
var wheelFaceMaterial = scope.wheelMaterials;
// body
scope.bodyMesh = new THREE.Mesh( scope.bodyGeometry, bodyFaceMaterial );
scope.bodyMesh.scale.set( s, s, s );
scope.root.add( scope.bodyMesh );
var forwardDelta = - this.speed * delta;
// front left wheel
carOrientation -= ( forwardDelta * this.turningRadius * 0.02 ) * wheelOrientation;
delta.multiplyVectors( scope.wheelOffset, new THREE.Vector3( s, s, s ) );
// movement of car
root.position.x += Math.sin( carOrientation ) * forwardDelta * length;
root.position.z += Math.cos( carOrientation ) * forwardDelta * length;
scope.frontLeftWheelRoot.position.add( delta );
// angle of car
root.rotation.y = carOrientation;
scope.frontLeftWheelMesh = new THREE.Mesh( scope.wheelGeometry, wheelFaceMaterial );
scope.frontLeftWheelMesh.scale.set( s, s, s );
// wheels rolling
var angularSpeedRatio = - 2 / wheelDiameter;
scope.frontLeftWheelRoot.add( scope.frontLeftWheelMesh );
scope.root.add( scope.frontLeftWheelRoot );
var wheelDelta = forwardDelta * angularSpeedRatio * length;
// front right wheel
frontLeftWheel.rotation[ this.wheelRotationAxis ] -= wheelDelta;
frontRightWheel.rotation[ this.wheelRotationAxis ] -= wheelDelta;
backLeftWheel.rotation[ this.wheelRotationAxis ] -= wheelDelta;
backRightWheel.rotation[ this.wheelRotationAxis ] -= wheelDelta;
delta.multiplyVectors( scope.wheelOffset, new THREE.Vector3( - s, s, s ) );
// rotation while steering
frontLeftWheelRoot.rotation[ this.wheelTurnAxis ] = wheelOrientation;
frontRightWheelRoot.rotation[ this.wheelTurnAxis ] = wheelOrientation;
scope.frontRightWheelRoot.position.add( delta );
steeringWheel.rotation[ this.steeringWheelTurnAxis ] = -wheelOrientation * 6;
scope.frontRightWheelMesh = new THREE.Mesh( scope.wheelGeometry, wheelFaceMaterial );
},
scope.frontRightWheelMesh.scale.set( s, s, s );
scope.frontRightWheelMesh.rotation.z = Math.PI;
setModel: function ( model, elemNames ) {
scope.frontRightWheelRoot.add( scope.frontRightWheelMesh );
scope.root.add( scope.frontRightWheelRoot );
if ( elemNames ) this.elemNames = elemNames;
// back left wheel
root = model;
delta.multiplyVectors( scope.wheelOffset, new THREE.Vector3( s, s, - s ) );
delta.z -= scope.backWheelOffset;
this.setupWheels();
this.computeDimensions();
scope.backLeftWheelMesh = new THREE.Mesh( scope.wheelGeometry, wheelFaceMaterial );
loaded = true;
scope.backLeftWheelMesh.position.add( delta );
scope.backLeftWheelMesh.scale.set( s, s, s );
},
scope.root.add( scope.backLeftWheelMesh );
setupWheels: function () {
// back right wheel
frontLeftWheelRoot = root.getObjectByName( this.elemNames.flWheel );
frontRightWheelRoot = root.getObjectByName( this.elemNames.frWheel );
backLeftWheel = root.getObjectByName( this.elemNames.rlWheel );
backRightWheel = root.getObjectByName( this.elemNames.rrWheel );
delta.multiplyVectors( scope.wheelOffset, new THREE.Vector3( - s, s, - s ) );
delta.z -= scope.backWheelOffset;
if ( this.elemNames.steeringWheel !== null ) steeringWheel = root.getObjectByName( this.elemNames.steeringWheel );
scope.backRightWheelMesh = new THREE.Mesh( scope.wheelGeometry, wheelFaceMaterial );
while ( frontLeftWheelRoot.children.length > 0 ) frontLeftWheel.add( frontLeftWheelRoot.children[ 0 ] );
while ( frontRightWheelRoot.children.length > 0 ) frontRightWheel.add( frontRightWheelRoot.children[ 0 ] );
scope.backRightWheelMesh.position.add( delta );
scope.backRightWheelMesh.scale.set( s, s, s );
scope.backRightWheelMesh.rotation.z = Math.PI;
frontLeftWheelRoot.add( frontLeftWheel );
frontRightWheelRoot.add( frontRightWheel );
scope.root.add( scope.backRightWheelMesh );
},
// cache meshes
computeDimensions: function () {
scope.meshes = [ scope.bodyMesh, scope.frontLeftWheelMesh, scope.frontRightWheelMesh, scope.backLeftWheelMesh, scope.backRightWheelMesh ];
var bb = new THREE.Box3().setFromObject( frontLeftWheelRoot );
// callback
var size = new THREE.Vector3();
bb.getSize( size );
scope.loaded = true;
wheelDiameter = Math.max( size.x, size.y, size.z );
if ( scope.callback ) {
bb.setFromObject( root );
scope.callback( scope );
}
size = bb.getSize( size );
length = Math.max( size.x, size.y, size.z );
}
}
function quadraticEaseOut( k ) {
return - k * ( k - 2 );
}
function cubicEaseOut( k ) {
return -- k * k * k + 1;
}
function circularEaseOut( k ) {
return Math.sqrt( 1 - -- k * k );
}
function sinusoidalEaseOut( k ) {
return Math.sin( k * Math.PI / 2 );
};
}
function exponentialEaseOut( k ) {
return k === 1 ? 1 : - Math.pow( 2, - 10 * k ) + 1;
}
};
return Car;
} )();
examples/webgl_materials_cars.html
浏览文件 @ fb3fb58c
此差异已折叠。
examples/webgl_materials_cubemap_dynamic2.html 已删除 100644 → 0
浏览文件 @ 35d1b5b2
<!DOCTYPE html>
<html lang="en">
<head>
<title>three.js webgl - materials - dynamic cube reflection</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<style>
body {
background-color: #000000;
margin: 0px;
overflow: hidden;
}
#info {
position: absolute;
top: 0px; width: 100%;
color: #ffffff;
padding: 5px;
font-family:Monospace;
font-size:13px;
font-weight: bold;
text-align:center;
}
a {
color: #ffffff;
}
</style>
</head>
<body>
<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">three.js webgl</a> - materials - dynamic cube reflection<br/>Photo by <a href="http://www.flickr.com/photos/jonragnarsson/2294472375/" target="_blank" rel="noopener">J&oacute;n Ragnarsson</a>.</div>
<script src="../build/three.js"></script>
<script>
var camera, scene, renderer;
var cube, sphere, torus, material;
var count = 0, cubeCamera1, cubeCamera2;
var lon = 0, lat = 0;
var phi = 0, theta = 0;
var textureLoader = new THREE.TextureLoader();
textureLoader.load( 'textures/2294472375_24a3b8ef46_o.jpg', function ( texture ) {
texture.mapping = THREE.UVMapping;
init( texture );
animate();
} );
function init( texture ) {
camera = new THREE.PerspectiveCamera( 60, window.innerWidth / window.innerHeight, 1, 1000 );
scene = new THREE.Scene();
var mesh = new THREE.Mesh( new THREE.SphereBufferGeometry( 500, 32, 16 ), new THREE.MeshBasicMaterial( { map: texture } ) );
mesh.geometry.scale( - 1, 1, 1 );
scene.add( mesh );
renderer = new THREE.WebGLRenderer( { antialias: true } );
renderer.setPixelRatio( window.devicePixelRatio );
renderer.setSize( window.innerWidth, window.innerHeight );
cubeCamera1 = new THREE.CubeCamera( 1, 1000, 256 );
cubeCamera1.renderTarget.texture.minFilter = THREE.LinearMipMapLinearFilter;
scene.add( cubeCamera1 );
cubeCamera2 = new THREE.CubeCamera( 1, 1000, 256 );
cubeCamera2.renderTarget.texture.minFilter = THREE.LinearMipMapLinearFilter;
scene.add( cubeCamera2 );
document.body.appendChild( renderer.domElement );
//
material = new THREE.MeshBasicMaterial( {
envMap: cubeCamera2.renderTarget.texture
} );
sphere = new THREE.Mesh( new THREE.IcosahedronBufferGeometry( 20, 3 ), material );
scene.add( sphere );
cube = new THREE.Mesh( new THREE.BoxBufferGeometry( 20, 20, 20 ), material );
scene.add( cube );
torus = new THREE.Mesh( new THREE.TorusKnotBufferGeometry( 10, 5, 100, 25 ), material );
scene.add( torus );
//
document.addEventListener( 'mousedown', onDocumentMouseDown, false );
document.addEventListener( 'wheel', onDocumentMouseWheel, false );
window.addEventListener( 'resize', onWindowResized, false );
}
function onWindowResized( event ) {
renderer.setSize( window.innerWidth, window.innerHeight );
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
}
function onDocumentMouseDown( event ) {
event.preventDefault();
onPointerDownPointerX = event.clientX;
onPointerDownPointerY = event.clientY;
onPointerDownLon = lon;
onPointerDownLat = lat;
document.addEventListener( 'mousemove', onDocumentMouseMove, false );
document.addEventListener( 'mouseup', onDocumentMouseUp, false );
}
function onDocumentMouseMove( event ) {
lon = ( event.clientX - onPointerDownPointerX ) * 0.1 + onPointerDownLon;
lat = ( event.clientY - onPointerDownPointerY ) * 0.1 + onPointerDownLat;
}
function onDocumentMouseUp( event ) {
document.removeEventListener( 'mousemove', onDocumentMouseMove, false );
document.removeEventListener( 'mouseup', onDocumentMouseUp, false );
}
function onDocumentMouseWheel( event ) {
var fov = camera.fov + event.deltaY * 0.05;
camera.fov = THREE.Math.clamp( fov, 10, 75 );
camera.updateProjectionMatrix();
}
function animate() {
requestAnimationFrame( animate );
render();
}
function render() {
var time = Date.now();
lon += .15;
lat = Math.max( - 85, Math.min( 85, lat ) );
phi = THREE.Math.degToRad( 90 - lat );
theta = THREE.Math.degToRad( lon );
cube.position.x = Math.cos( time * 0.001 ) * 30;
cube.position.y = Math.sin( time * 0.001 ) * 30;
cube.position.z = Math.sin( time * 0.001 ) * 30;
cube.rotation.x += 0.02;
cube.rotation.y += 0.03;
torus.position.x = Math.cos( time * 0.001 + 10 ) * 30;
torus.position.y = Math.sin( time * 0.001 + 10 ) * 30;
torus.position.z = Math.sin( time * 0.001 + 10 ) * 30;
torus.rotation.x += 0.02;
torus.rotation.y += 0.03;
camera.position.x = 100 * Math.sin( phi ) * Math.cos( theta );
camera.position.y = 100 * Math.cos( phi );
camera.position.z = 100 * Math.sin( phi ) * Math.sin( theta );
camera.lookAt( scene.position );
sphere.visible = false;
// pingpong
if ( count % 2 === 0 ) {
material.envMap = cubeCamera1.renderTarget.texture;
cubeCamera2.update( renderer, scene );
} else {
material.envMap = cubeCamera2.renderTarget.texture;
cubeCamera1.update( renderer, scene );
}
count ++;
sphere.visible = true;
renderer.render( scene, camera );
}
</script>
</body>
</html>
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或