提交 b913baa6 编写于 作者: M Mr.doob

Code clean up and minor optimisations.

上级 2c50ad36
此差异已折叠。
此差异已折叠。
<!DOCTYPE HTML>
<html lang="en">
<head>
<title>three.js - geometry - cube</title>
<title>three.js - geometry - sphere</title>
<meta charset="utf-8">
<style type="text/css">
body {
......@@ -60,23 +60,16 @@
<script type="text/javascript" src="../src/renderers/renderables/RenderableLine.js"></script>
<script type="text/javascript" src="../src/extras/primitives/Sphere.js"></script>
<script type="text/javascript" src="../src/extras/primitives/Plane.js"></script>
<script type="text/javascript" src="js/Stats.js"></script>
<script type="text/javascript">
var SCREEN_WIDTH = window.innerWidth;
var SCREEN_HEIGHT = window.innerHeight;
var container, stats;
var container;
var stats;
var camera, scene, renderer, objects;
var camera;
var scene;
var renderer;
var cube, plane;
var sphere;
var targetRotation = 0;
var targetRotationOnMouseDown = 0;
......@@ -111,43 +104,59 @@
container = document.createElement('div');
document.body.appendChild(container);
camera = new THREE.Camera( 45, SCREEN_WIDTH / SCREEN_HEIGHT, 1, 10000 );
camera = new THREE.Camera( 45, window.innerWidth / window.innerHeight, 1, 10000 );
camera.position.y = 150;
camera.position.z = 400;
camera.target.position.y = 150;
scene = new THREE.Scene();
// Plane
// Grid
var geometry = new THREE.Geometry();
geometry.vertices.push( new THREE.Vertex( new THREE.Vector3( - 500, 0, 0 ) ) );
geometry.vertices.push( new THREE.Vertex( new THREE.Vector3( 500, 0, 0 ) ) );
var material = new THREE.LineBasicMaterial( { color: 0x000000, opacity: 0.5 } );
var material = new THREE.MeshBasicMaterial( { color: 0x000000, opacity: 0.5, wireframe: true, wireframe_size: 1 } );
for ( var i = 0; i <= 10; i ++ ) {
plane = new THREE.Mesh( new Plane( 1000, 1000, 10, 10 ), material );
plane.rotation.x = - 90 * ( Math.PI / 180 );
plane.doubleSided = true;
scene.addObject( plane );
var line = new THREE.Line( geometry, material );
line.position.z = ( i * 100 ) - 500;
scene.addObject( line );
var line = new THREE.Line( geometry, material );
line.position.x = ( i * 100 ) - 500;
line.rotation.y = 90 * Math.PI / 180;
scene.addObject( line );
}
// Spheres
objects = [];
geometry = new Sphere( 100, 16, 8 );
material = new THREE.MeshLambertMaterial( { color: 0xffffff, opacity: 1 } );
for ( var i = 0; i < 10; i ++ ) {
cube = new THREE.Mesh( geometry, material );
cube.overdraw = true;
sphere = new THREE.Mesh( geometry, material );
sphere.overdraw = true;
cube.position.x = Math.random() * 1000 - 500;
cube.position.y = Math.random() * 1000 - 500;
cube.position.z = Math.random() * 1000 - 500;
sphere.position.x = Math.random() * 1000 - 500;
sphere.position.y = Math.random() * 1000 - 500;
sphere.position.z = Math.random() * 1000 - 500;
cube.rotation.x = Math.random() * 200 - 100;
cube.rotation.y = Math.random() * 200 - 100;
cube.rotation.z = Math.random() * 200 - 100;
sphere.rotation.x = Math.random() * 200 - 100;
sphere.rotation.y = Math.random() * 200 - 100;
sphere.rotation.z = Math.random() * 200 - 100;
cube.scale.x = cube.scale.y = cube.scale.z = Math.random() + 0.5;
sphere.scale.x = sphere.scale.y = sphere.scale.z = Math.random() + 0.5;
scene.addObject(cube);
objects.push( sphere );
scene.addObject( sphere );
}
......@@ -168,7 +177,7 @@
renderer = new THREE.CanvasRenderer();
renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
renderer.setSize( window.innerWidth, window.innerHeight );
container.appendChild( renderer.domElement );
......@@ -272,9 +281,10 @@
debugContext.rect( camera.target.position.x * 0.1 - 5, camera.target.position.z * 0.1 - 5, 10, 10 );
debugContext.rect( - 50, - 50, 100, 100 );
for ( var i = 1; i < scene.objects.length; i++ ) {
for ( var i = 0, l = objects.length; i < l; i++ ) {
var object = objects[ i ];
var object = scene.objects[i];
object.rotation.x += 0.01;
object.rotation.y += 0.005;
object.position.y = Math.sin( object.rotation.x ) * 200;
......
......@@ -3,8 +3,8 @@ var Qrcode = function () {
THREE.Geometry.call( this );
var scope = this,
m1 = new THREE.MeshLambertMaterial( { color: 0x000000 } ),
m2 = new THREE.MeshLambertMaterial( { color: 0xc0c0c0 } );
m1 = new THREE.MeshLambertMaterial( { color: 0x000000, shading: THREE.FlatShading } ),
m2 = new THREE.MeshLambertMaterial( { color: 0xc0c0c0, shading: THREE.FlatShading } );
v(-54,134,58);
v(-54,146,58);
......
......@@ -145,7 +145,7 @@
} else {
var position = new THREE.Vector3().add( intersects[ 0 ].point, intersects[ 0 ].object.matrixRotation.transform( intersects[ 0 ].face.normal.clone() ) );
var position = new THREE.Vector3().add( intersects[ 0 ].point, intersects[ 0 ].object.rotationMatrix.transform( intersects[ 0 ].face.normal.clone() ) );
var voxel = new THREE.Mesh( new Cube( 50, 50, 50 ), [ new THREE.MeshLambertMaterial( { color: 0x00ff80, opacity: 1 } ), new THREE.MeshFaceMaterial() ] );
voxel.position.x = Math.floor( position.x / 50 ) * 50 + 25;
......
......@@ -60,7 +60,7 @@
scene = new THREE.Scene();
object = new THREE.Mesh( new WaltHead(), new THREE.MeshLambertMaterial( { color: 0xffffff } ) );
object = new THREE.Mesh( new WaltHead(), new THREE.MeshLambertMaterial( { color: 0xffffff, shading: THREE.FlatShading } ) );
object.overdraw = true;
scene.addObject( object );
......
......@@ -42,7 +42,6 @@
<script type="text/javascript" src="../src/extras/io/Loader.js"></script>
<script type="text/javascript" src="../src/extras/primitives/Sphere.js"></script>
<script type="text/javascript" src="../src/extras/primitives/Plane.js"></script>
<script type="text/javascript" src="js/Stats.js"></script>
......@@ -94,23 +93,25 @@
scene = new THREE.Scene();
// Spheres
// SPHERES
var geometry = new Sphere( 100, 16, 8 );
var material = new THREE.MeshLambertMaterial( { color: 0xffffff, shading: THREE.FlatShading } );
sphere = new Sphere( 100, 16, 8 );
for (var i=0; i<30; i++) {
mesh = new THREE.Mesh( sphere, new THREE.MeshLambertMaterial( { color: 0xffffff, shading: THREE.FlatShading } ) );
mesh.position.x = 500 * (Math.random() - 0.5);
mesh.position.y = 500 * (Math.random() - 0.5);
mesh.position.z = 500 * (Math.random() - 0.5);
mesh.scale.x = mesh.scale.y = mesh.scale.z = 0.25 * (Math.random() + 0.5);
for ( var i = 0; i < 30; i ++ ) {
mesh = new THREE.Mesh( geometry, material );
mesh.position.x = 500 * ( Math.random() - 0.5 );
mesh.position.y = 500 * ( Math.random() - 0.5 );
mesh.position.z = 500 * ( Math.random() - 0.5 );
mesh.scale.x = mesh.scale.y = mesh.scale.z = 0.25 * ( Math.random() + 0.5 );
mesh.overdraw = true;
mesh.updateMatrix();
scene.addObject(mesh);
}
}
// LIGHTS
// Lights
var ambient = new THREE.AmbientLight( 0x101010 );
scene.addLight( ambient );
......@@ -127,9 +128,7 @@
pointLight.position.z = 0;
scene.addLight( pointLight );
sphere = new Sphere( 100, 16, 8 );
lightMesh = new THREE.Mesh( sphere, new THREE.MeshBasicMaterial( { color: 0xffaa00 } ) );
lightMesh = new THREE.Mesh( geometry, new THREE.MeshBasicMaterial( { color: 0xffaa00 } ) );
lightMesh.scale.x = lightMesh.scale.y = lightMesh.scale.z = 0.05;
lightMesh.position = pointLight.position;
lightMesh.overdraw = true;
......@@ -137,21 +136,28 @@
scene.addObject(lightMesh);
if( render_canvas ) {
if ( render_canvas ) {
canvasRenderer = new THREE.CanvasRenderer();
canvasRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
container.appendChild( canvasRenderer.domElement );
}
if ( render_gl ) {
try {
webglRenderer = new THREE.WebGLRenderer( scene );
webglRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
container.appendChild( webglRenderer.domElement );
has_gl = 1;
} catch (e) {
}
catch (e) {
}
}
stats = new Stats();
......@@ -165,26 +171,24 @@
var loader = new THREE.Loader();
//loader.loadAscii( "obj/torus/Torus_slim.js", function( geometry ) { createScene( geometry ) } );
loader.loadBinary( "obj/torus/Torus_bin.js", function( geometry ) { createScene( geometry ) }, "obj/torus" );
//loader.loadAscii( "obj/torus/Torus_slim.js", function( geometry ) { createMesh( geometry ) } );
loader.loadBinary( "obj/torus/Torus_bin.js", function( geometry ) { createMesh( geometry ) }, "obj/torus" );
}
function createScene( geometry ) {
function createMesh( geometry ) {
zmesh = new THREE.Mesh( geometry, new THREE.MeshLambertMaterial( { color: 0xffffff } ) );
zmesh.position.x = 0;
zmesh.position.z = 0;
zmesh.position.y = 0;
zmesh.position.x = zmesh.position.y = zmesh.position.z = 0;
zmesh.scale.x = zmesh.scale.y = zmesh.scale.z = 100;
zmesh.overdraw = true;
zmesh.updateMatrix();
scene.addObject(zmesh);
scene.addObject( zmesh );
}
function onDocumentMouseMove(event) {
function onDocumentMouseMove( event ) {
mouseX = ( event.clientX - windowHalfX );
mouseY = ( event.clientY - windowHalfY );
......@@ -200,12 +204,18 @@
camera.updateMatrix();
for(var i=0; i<scene.objects.length; ++i) {
for ( var i = 0, l = scene.objects.length; i < l; i ++ ) {
if ( i%3 == 1 )
scene.objects[i].rotation.x += 0.05;
else if ( i%3 == 2 )
scene.objects[i].rotation.y += 0.05;
else if ( i%3 == 0 )
scene.objects[i].rotation.z += 0.05;
scene.objects[i].updateMatrix();
......
......@@ -60,7 +60,7 @@
material = new THREE.ParticleCircleMaterial( { color: 0xffffff } );
var geometry = new THREE.Geometry();
for (var i = 0; i < 100; i++) {
for ( var i = 0; i < 100; i ++ ) {
particle = new THREE.Particle( material );
particle.position.x = Math.random() * 2 - 1;
......@@ -78,7 +78,7 @@
// lines
var line = new THREE.Line( geometry, new THREE.LineBasicMaterial( { color: 0xffffff, opacity: 0.5 } ) );
scene.addObject(line);
scene.addObject( line );
/*
stats = new Stats();
......@@ -87,9 +87,9 @@
container.appendChild(stats.domElement);
*/
document.addEventListener('mousemove', onDocumentMouseMove, false);
document.addEventListener('touchstart', onDocumentTouchStart, false);
document.addEventListener('touchmove', onDocumentTouchMove, false);
document.addEventListener( 'mousemove', onDocumentMouseMove, false );
document.addEventListener( 'touchstart', onDocumentTouchStart, false );
document.addEventListener( 'touchmove', onDocumentTouchMove, false );
}
//
......@@ -102,23 +102,23 @@
function onDocumentTouchStart( event ) {
if(event.touches.length > 1) {
if ( event.touches.length > 1 ) {
event.preventDefault();
mouseX = event.touches[0].pageX - windowHalfX;
mouseY = event.touches[0].pageY - windowHalfY;
mouseX = event.touches[ 0 ].pageX - windowHalfX;
mouseY = event.touches[ 0 ].pageY - windowHalfY;
}
}
function onDocumentTouchMove( event ) {
if(event.touches.length == 1) {
if ( event.touches.length == 1 ) {
event.preventDefault();
mouseX = event.touches[0].pageX - windowHalfX;
mouseY = event.touches[0].pageY - windowHalfY;
mouseX = event.touches[ 0 ].pageX - windowHalfX;
mouseY = event.touches[ 0 ].pageY - windowHalfY;
}
}
......@@ -126,8 +126,8 @@
function loop() {
camera.position.x += (mouseX - camera.position.x) * .05;
camera.position.y += (-mouseY + 200 - camera.position.y) * .05;
camera.position.x += ( mouseX - camera.position.x ) * .05;
camera.position.y += ( - mouseY + 200 - camera.position.y ) * .05;
camera.updateMatrix();
renderer.render(scene, camera);
......
......@@ -17,7 +17,6 @@
<script type="text/javascript" src="../build/Three.js"></script>
<script type="text/javascript" src="../src/extras/primitives/Sphere.js"></script>
<script type="text/javascript" src="../src/extras/primitives/Plane.js"></script>
<script type="text/javascript" src="js/Stats.js"></script>
......@@ -48,14 +47,16 @@
geometry.vertices.push( new THREE.Vertex( new THREE.Vector3( - 500, 0, 0 ) ) );
geometry.vertices.push( new THREE.Vertex( new THREE.Vector3( 500, 0, 0 ) ) );
var material = new THREE.LineBasicMaterial( { color: 0xffffff, opacity: 0.2 } );
for ( var i = 0; i <= 10; i ++ ) {
var line = new THREE.Line( geometry, new THREE.LineBasicMaterial( { color: 0xffffff, opacity: 0.2 } ) );
var line = new THREE.Line( geometry, material );
line.position.y = - 120;
line.position.z = ( i * 100 ) - 500;
scene.addObject( line );
var line = new THREE.Line( geometry, new THREE.LineBasicMaterial( { color: 0xffffff, opacity: 0.2 } ) );
var line = new THREE.Line( geometry, material );
line.position.x = ( i * 100 ) - 500;
line.position.y = - 120;
line.rotation.y = 90 * Math.PI / 180;
......@@ -74,8 +75,8 @@
materials.push( { material: new THREE.MeshBasicMaterial( { color: 0x00ffff, wireframe: true } ), overdraw: false, doubleSided: true } );
//materials.push( { material: new THREE.MeshBasicMaterial( { color: 0xff0000, blending: THREE.SubtractiveBlending } ), overdraw: false, doubleSided: true } );
materials.push( { material: new THREE.MeshBasicMaterial( { color: 0xff0000, blending: THREE.AdditiveBlending } ), overdraw: false, doubleSided: true } );
materials.push( { material: new THREE.MeshLambertMaterial( { color: 0xffffff } ), overdraw: true, doubleSided: false } );
materials.push( { material: new THREE.MeshPhongMaterial( { ambient: 0x030383, color: 0xf55555, specular: 0x66f6f6, shininess: 10 } ), overdraw: true, doubleSided: false } );
materials.push( { material: new THREE.MeshLambertMaterial( { color: 0xffffff, shading: THREE.FlatShading } ), overdraw: true, doubleSided: false } );
materials.push( { material: new THREE.MeshPhongMaterial( { ambient: 0x030383, color: 0xf55555, specular: 0x66f6f6, shininess: 10, shading: THREE.FlatShading } ), overdraw: true, doubleSided: false } );
materials.push( { material: new THREE.MeshDepthMaterial( { near: 1, far: 2000 } ), overdraw: true, doubleSided: false } );
materials.push( { material: new THREE.MeshNormalMaterial( ), overdraw: true, doubleSided: false } );
materials.push( { material: new THREE.MeshBasicMaterial( { map: generatedTexture } ), overdraw: true, doubleSided: false } );
......
......@@ -8,10 +8,6 @@
THREE.Matrix4 = function () {
this._x = new THREE.Vector3();
this._y = new THREE.Vector3();
this._z = new THREE.Vector3();
};
THREE.Matrix4.prototype = {
......@@ -41,16 +37,11 @@ THREE.Matrix4.prototype = {
lookAt: function ( eye, center, up ) {
var x = this._x, y = this._y, z = this._z;
z.sub( eye, center );
z.normalize();
x.cross( up, z );
x.normalize();
var x = new THREE.Vector3(), y = new THREE.Vector3(), z = new THREE.Vector3();
y.cross( z, x );
y.normalize();
z.sub( eye, center ).normalize();
x.cross( up, z ).normalize();
y.cross( z, x ).normalize();
this.n11 = x.x; this.n12 = x.y; this.n13 = x.z; this.n14 = - x.dot( eye );
this.n21 = y.x; this.n22 = y.y; this.n23 = y.z; this.n24 = - y.dot( eye );
......@@ -61,7 +52,7 @@ THREE.Matrix4.prototype = {
transform: function ( v ) {
var vx = v.x, vy = v.y, vz = v.z, vw = v.w ? v.w : 1;
var vx = v.x, vy = v.y, vz = v.z, vw = v.w || 1, vwi;
v.x = this.n11 * vx + this.n12 * vy + this.n13 * vz + this.n14 * vw;
v.y = this.n21 * vx + this.n22 * vy + this.n23 * vz + this.n24 * vw;
......@@ -75,9 +66,10 @@ THREE.Matrix4.prototype = {
} else {
v.x = v.x / vw;
v.y = v.y / vw;
v.z = v.z / vw;
vwi = 1 / vw;
v.x *= vwi;
v.y *= vwi;
v.z *= vwi;
}
......
......@@ -57,7 +57,7 @@ THREE.Ray.prototype = {
c = object.matrix.transform( vertices[ face.c ].position.clone() );
d = face instanceof THREE.Face4 ? object.matrix.transform( vertices[ face.d ].position.clone() ) : null;
normal = object.matrixRotation.transform( face.normal.clone() );
normal = object.rotationMatrix.transform( face.normal.clone() );
dot = direction.dot( normal );
if ( dot < 0 ) { // Math.abs( dot ) > 0.0001
......
......@@ -34,7 +34,7 @@ THREE.Vector3.prototype = {
},
add: function( v1, v2 ) {
add: function ( v1, v2 ) {
this.x = v1.x + v2.x;
this.y = v1.y + v2.y;
......@@ -144,7 +144,8 @@ THREE.Vector3.prototype = {
distanceTo: function ( v ) {
return Math.sqrt( this.distanceToSquared( v ) );
var dx = this.x - v.x, dy = this.y - v.y, dz = this.z - v.z;
return Math.sqrt( dx * dx + dy * dy + dz * dz );
},
......@@ -179,15 +180,9 @@ THREE.Vector3.prototype = {
normalize: function () {
if ( this.length() > 0 ) {
this.multiplyScalar( 1 / this.length() );
} else {
this.multiplyScalar( 0 );
var length = Math.sqrt( this.x * this.x + this.y * this.y + this.z * this.z );
}
length > 0 ? this.multiplyScalar( 1 / length ) : this.set( 0, 0, 0 );
return this;
......
......@@ -9,29 +9,28 @@ THREE.Object3D = function ( material ) {
this.scale = new THREE.Vector3( 1, 1, 1 );
this.matrix = new THREE.Matrix4();
this.matrixTranslation = new THREE.Matrix4();
this.matrixRotation = new THREE.Matrix4();
this.matrixScale = new THREE.Matrix4();
this.translationMatrix = new THREE.Matrix4();
this.rotationMatrix = new THREE.Matrix4();
this.scaleMatrix = new THREE.Matrix4();
this.screen = new THREE.Vector3();
this.visible = true;
this.autoUpdateMatrix = true;
this.updateMatrix = function () {
this.matrixPosition = THREE.Matrix4.translationMatrix( this.position.x, this.position.y, this.position.z );
this.matrixRotation = THREE.Matrix4.rotationXMatrix( this.rotation.x );
this.matrixRotation.multiplySelf( THREE.Matrix4.rotationYMatrix( this.rotation.y ) );
this.matrixRotation.multiplySelf( THREE.Matrix4.rotationZMatrix( this.rotation.z ) );
this.rotationMatrix = THREE.Matrix4.rotationXMatrix( this.rotation.x );
this.rotationMatrix.multiplySelf( THREE.Matrix4.rotationYMatrix( this.rotation.y ) );
this.rotationMatrix.multiplySelf( THREE.Matrix4.rotationZMatrix( this.rotation.z ) );
this.matrixScale = THREE.Matrix4.scaleMatrix( this.scale.x, this.scale.y, this.scale.z );
this.scaleMatrix = THREE.Matrix4.scaleMatrix( this.scale.x, this.scale.y, this.scale.z );
this.matrix.copy( this.matrixPosition );
this.matrix.multiplySelf( this.matrixRotation );
this.matrix.multiplySelf( this.matrixScale );
this.matrix.multiplySelf( this.rotationMatrix );
this.matrix.multiplySelf( this.scaleMatrix );
};
......
......@@ -78,9 +78,6 @@ THREE.CanvasRenderer = function () {
_canvas.width = _canvasWidth;
_canvas.height = _canvasHeight;
_context.lineJoin = 'round';
_context.lineCap = 'round';
_clipRect.set( - _canvasWidthHalf, - _canvasHeightHalf, _canvasWidthHalf, _canvasHeightHalf );
};
......@@ -92,7 +89,6 @@ THREE.CanvasRenderer = function () {
_clearRect.inflate( 1 );
_clearRect.minSelf( _clipRect );
_context.setTransform( 1, 0, 0, - 1, _canvasWidthHalf, _canvasHeightHalf );
_context.clearRect( _clearRect.getX(), _clearRect.getY(), _clearRect.getWidth(), _clearRect.getHeight() );
_clearRect.empty();
......@@ -104,26 +100,18 @@ THREE.CanvasRenderer = function () {
var e, el, element, m, ml, fm, fml, material;
if ( this.autoClear ) {
this.clear();
_context.setTransform( 1, 0, 0, - 1, _canvasWidthHalf, _canvasHeightHalf );
}
this.autoClear && this.clear();
_renderList = _projector.projectScene( scene, camera );
_context.setTransform( 1, 0, 0, - 1, _canvasWidthHalf, _canvasHeightHalf );
/* DEBUG
_context.fillStyle = 'rgba(0, 255, 255, 0.5)';
_context.fillRect( _clipRect.getX(), _clipRect.getY(), _clipRect.getWidth(), _clipRect.getHeight() );
*/
if ( _enableLighting = scene.lights.length > 0 ) {
calculateLights( scene );
}
( _enableLighting = scene.lights.length > 0 ) && calculateLights( scene );
for ( e = 0, el = _renderList.length; e < el; e++ ) {
......@@ -138,8 +126,7 @@ THREE.CanvasRenderer = function () {
for ( m = 0, ml = element.material.length; m < ml; m++ ) {
material = element.material[ m ];
renderParticle( _v1, element, material, scene );
renderParticle( _v1, element, element.material[ m ], scene );
}
......@@ -153,21 +140,19 @@ THREE.CanvasRenderer = function () {
_bboxRect.addPoint( _v1.positionScreen.x, _v1.positionScreen.y );
_bboxRect.addPoint( _v2.positionScreen.x, _v2.positionScreen.y );
if ( !_clipRect.instersects( _bboxRect ) ) {
continue;
if ( _clipRect.instersects( _bboxRect ) ) {
}
m = 0; ml = element.material.length;
m = 0; ml = element.material.length;
while ( m < ml ) {
while ( m < ml ) {
renderLine( _v1, _v2, element, element.material[ m ++ ], scene );
material = element.material[ m ++ ];
renderLine( _v1, _v2, element, material, scene );
}
}
} else if ( element instanceof THREE.RenderableFace3 ) {
_v1 = element.v1; _v2 = element.v2; _v3 = element.v3;
......@@ -188,35 +173,33 @@ THREE.CanvasRenderer = function () {
_bboxRect.addPoint( _v2.positionScreen.x, _v2.positionScreen.y );
_bboxRect.addPoint( _v3.positionScreen.x, _v3.positionScreen.y );
if ( !_clipRect.instersects( _bboxRect ) ) {
if ( _clipRect.instersects( _bboxRect ) ) {
continue;
m = 0; ml = element.meshMaterial.length;
}
while ( m < ml ) {
m = 0; ml = element.meshMaterial.length;
material = element.meshMaterial[ m ++ ];
while ( m < ml ) {
if ( material instanceof THREE.MeshFaceMaterial ) {
material = element.meshMaterial[ m ++ ];
fm = 0; fml = element.faceMaterial.length;
if ( material instanceof THREE.MeshFaceMaterial ) {
while ( fm < fml ) {
fm = 0; fml = element.faceMaterial.length;
material = element.faceMaterial[ fm ++ ];
material && renderFace3( _v1, _v2, _v3, element, material, scene );
while ( fm < fml ) {
}
material = element.faceMaterial[ fm ++ ];
material && renderFace3( _v1, _v2, _v3, element, material, scene );
continue;
}
continue;
renderFace3( _v1, _v2, _v3, element, material, scene );
}
renderFace3( _v1, _v2, _v3, element, material, scene );
}
} else if ( element instanceof THREE.RenderableFace4 ) {
......@@ -237,10 +220,6 @@ THREE.CanvasRenderer = function () {
expand( _v2.positionScreen, _v4.positionScreen );
expand( _v4.positionScreen, _v1.positionScreen );
}
if ( element.overdraw ) {
expand( _v3.positionScreen, _v5.positionScreen );
expand( _v3.positionScreen, _v6.positionScreen );
......@@ -251,35 +230,33 @@ THREE.CanvasRenderer = function () {
_bboxRect.addPoint( _v3.positionScreen.x, _v3.positionScreen.y );
_bboxRect.addPoint( _v4.positionScreen.x, _v4.positionScreen.y );
if ( !_clipRect.instersects( _bboxRect ) ) {
if ( _clipRect.instersects( _bboxRect ) ) {
continue;
m = 0; ml = element.meshMaterial.length;
}
while ( m < ml ) {
m = 0; ml = element.meshMaterial.length;
material = element.meshMaterial[ m ++ ];
while ( m < ml ) {
if ( material instanceof THREE.MeshFaceMaterial ) {
material = element.meshMaterial[ m ++ ];
fm = 0; fml = element.faceMaterial.length;
if ( material instanceof THREE.MeshFaceMaterial ) {
while ( fm < fml ) {
fm = 0; fml = element.faceMaterial.length;
material = element.faceMaterial[ fm ++ ];
material && renderFace4( _v1, _v2, _v3, _v4, _v5, _v6, element, material, scene );
while ( fm < fml ) {
}
material = element.faceMaterial[ fm ++ ];
material && renderFace4( _v1, _v2, _v3, _v4, _v5, _v6, element, material, scene );
continue;
}
continue;
renderFace4( _v1, _v2, _v3, _v4, _v5, _v6, element, material, scene );
}
renderFace4( _v1, _v2, _v3, _v4, _v5, _v6, element, material, scene );
}
}
......@@ -314,7 +291,7 @@ THREE.CanvasRenderer = function () {
_directionalLights.setRGB( 0, 0, 0 );
_pointLights.setRGB( 0, 0, 0 );
for ( l = 0, ll = lights.length; l < ll; l++ ) {
for ( l = 0, ll = lights.length; l < ll; l ++ ) {
light = lights[ l ];
lightColor = light.color;
......@@ -348,17 +325,18 @@ THREE.CanvasRenderer = function () {
var l, ll, light, lightColor, amount
lights = scene.lights;
for ( l = 0, ll = lights.length; l < ll; l++ ) {
for ( l = 0, ll = lights.length; l < ll; l ++ ) {
light = lights[ l ];
lightColor = light.color;
if ( light instanceof THREE.DirectionalLight ) {
amount = element.normalWorld.dot( light.position ) * light.intensity;
amount = element.normalWorld.dot( light.position );
if ( amount > 0 ) {
amount *= light.intensity;
color.r += lightColor.r * amount;
color.g += lightColor.g * amount;
color.b += lightColor.b * amount;
......@@ -370,10 +348,11 @@ THREE.CanvasRenderer = function () {
_vector3.sub( light.position, element.centroidWorld );
_vector3.normalize();
amount = element.normalWorld.dot( _vector3 ) * light.intensity;
amount = element.normalWorld.dot( _vector3 );
if ( amount > 0 ) {
amount *= light.intensity;
color.r += lightColor.r * amount;
color.g += lightColor.g * amount;
color.b += lightColor.b * amount;
......@@ -553,25 +532,44 @@ THREE.CanvasRenderer = function () {
if ( _enableLighting ) {
_light.r = _ambientLight.r;
_light.g = _ambientLight.g;
_light.b = _ambientLight.b;
if ( material.shading == THREE.FlatShading ) {
calculateFaceLight( scene, element, _light );
_light.r = _ambientLight.r;
_light.g = _ambientLight.g;
_light.b = _ambientLight.b;
_color.r = material.color.r * _light.r;
_color.g = material.color.g * _light.g;
_color.b = material.color.b * _light.b;
calculateFaceLight( scene, element, _light );
_color.updateStyleString();
_color.r = material.color.r * _light.r;
_color.g = material.color.g * _light.g;
_color.b = material.color.b * _light.b;
_color.updateStyleString();
drawTriangle( _v1x, _v1y, _v2x, _v2y, _v3x, _v3y, _color, material.wireframe, material.wireframe_linewidth );
} else if ( material.shading == THREE.SmoothShading ) {
_light.r = _ambientLight.r;
_light.g = _ambientLight.g;
_light.b = _ambientLight.b;
calculateFaceLight( scene, element, _light );
_color.r = material.color.r * _light.r;
_color.g = material.color.g * _light.g;
_color.b = material.color.b * _light.b;
_color.updateStyleString();
}
} else {
_color.__styleString = material.color.__styleString;
drawTriangle( _v1x, _v1y, _v2x, _v2y, _v3x, _v3y, material.color.__styleString, material.wireframe, material.wireframe_linewidth );
}
drawTriangle( _v1x, _v1y, _v2x, _v2y, _v3x, _v3y, _color, material.wireframe, material.wireframe_linewidth );
} else if ( material instanceof THREE.MeshDepthMaterial ) {
......
......@@ -21,21 +21,15 @@ THREE.Projector = function() {
this.projectScene = function ( scene, camera ) {
var o, ol, v, vl, f, fl, objects, object, objectMatrix,
var o, ol, v, vl, f, fl, objects, object,
objectMatrix, objectRotationMatrix, objectMaterial, objectOverdraw,
vertices, vertex, vertexPositionScreen,
faces, face, v1, v2, v3, v4;
_renderList = [];
_face3Count = 0;
_face4Count = 0;
_lineCount = 0;
_particleCount = 0;
_face3Count = _face4Count = _lineCount = _particleCount = 0;
if( camera.autoUpdateMatrix ) {
camera.updateMatrix();
}
camera.autoUpdateMatrix && camera.updateMatrix();
_projScreenMatrix.multiply( camera.projectionMatrix, camera.matrix );
......@@ -45,12 +39,11 @@ THREE.Projector = function() {
object = objects[ o ];
objectMatrix = object.matrix;
objectRotationMatrix = object.rotationMatrix;
objectMaterial = object.material;
objectOverdraw = object.overdraw;
if( object.autoUpdateMatrix ) {
object.updateMatrix();
}
object.autoUpdateMatrix && object.updateMatrix();
if ( object instanceof THREE.Mesh ) {
......@@ -96,12 +89,13 @@ THREE.Projector = function() {
( v3.positionScreen.y - v1.positionScreen.y ) * ( v2.positionScreen.x - v1.positionScreen.x ) < 0 ) ) ) {
_face3 = _face3Pool[ _face3Count ] = _face3Pool[ _face3Count ] || new THREE.RenderableFace3();
_face3.v1.positionScreen.copy( v1.positionScreen );
_face3.v2.positionScreen.copy( v2.positionScreen );
_face3.v3.positionScreen.copy( v3.positionScreen );
_face3.normalWorld.copy( face.normal );
object.matrixRotation.transform( _face3.normalWorld );
objectRotationMatrix.transform( _face3.normalWorld );
_face3.centroidWorld.copy( face.centroid );
objectMatrix.transform( _face3.centroidWorld );
......@@ -111,11 +105,10 @@ THREE.Projector = function() {
_face3.z = _face3.centroidScreen.z;
_face3.meshMaterial = object.material;
_face3.meshMaterial = objectMaterial;
_face3.faceMaterial = face.material;
_face3.overdraw = object.overdraw;
_face3.overdraw = objectOverdraw;
_face3.uvs = object.geometry.uvs[ f ];
_face3.color = face.color;
_renderList.push( _face3 );
......@@ -138,13 +131,14 @@ THREE.Projector = function() {
( v2.positionScreen.y - v3.positionScreen.y ) * ( v4.positionScreen.x - v3.positionScreen.x ) < 0 ) ) ) ) {
_face4 = _face4Pool[ _face4Count ] = _face4Pool[ _face4Count ] || new THREE.RenderableFace4();
_face4.v1.positionScreen.copy( v1.positionScreen );
_face4.v2.positionScreen.copy( v2.positionScreen );
_face4.v3.positionScreen.copy( v3.positionScreen );
_face4.v4.positionScreen.copy( v4.positionScreen );
_face4.normalWorld.copy( face.normal );
object.matrixRotation.transform( _face4.normalWorld );
objectRotationMatrix.transform( _face4.normalWorld );
_face4.centroidWorld.copy( face.centroid );
objectMatrix.transform( _face4.centroidWorld );
......@@ -154,11 +148,10 @@ THREE.Projector = function() {
_face4.z = _face4.centroidScreen.z;
_face4.meshMaterial = object.material;
_face4.meshMaterial = objectMaterial;
_face4.faceMaterial = face.material;
_face4.overdraw = object.overdraw;
_face4.overdraw = objectOverdraw;
_face4.uvs = object.geometry.uvs[ f ];
_face4.color = face.color;
_renderList.push( _face4 );
......
......@@ -4,6 +4,8 @@
THREE.RenderableFace3 = function () {
this.z = null;
this.v1 = new THREE.Vertex();
this.v2 = new THREE.Vertex();
this.v3 = new THREE.Vertex();
......@@ -12,10 +14,11 @@ THREE.RenderableFace3 = function () {
this.centroidScreen = new THREE.Vector3();
this.normalWorld = new THREE.Vector3();
this.vertexNormalsWorld = [ new THREE.Vector3(), new THREE.Vector3(), new THREE.Vector3() ];
this.z = null;
this.color = null;
this.material = null;
this.meshMaterial = null;
this.faceMaterial = null;
this.overdraw = false;
this.uv = null;
};
......@@ -4,6 +4,8 @@
THREE.RenderableFace4 = function () {
this.z = null;
this.v1 = new THREE.Vertex();
this.v2 = new THREE.Vertex();
this.v3 = new THREE.Vertex();
......@@ -13,10 +15,11 @@ THREE.RenderableFace4 = function () {
this.centroidScreen = new THREE.Vector3();
this.normalWorld = new THREE.Vector3();
this.vertexNormalsWorld = [ new THREE.Vector3(), new THREE.Vector3(), new THREE.Vector3(), new THREE.Vector3() ];
this.z = null;
this.color = null;
this.material = null;
this.meshMaterial = null;
this.faceMaterial = null;
this.overdraw = false;
this.uv = null;
};
......@@ -4,12 +4,11 @@
THREE.RenderableLine = function () {
this.z = null;
this.v1 = new THREE.Vertex();
this.v2 = new THREE.Vertex();
this.z = null;
this.color = null;
this.material = null;
};
......@@ -11,7 +11,6 @@ THREE.RenderableParticle = function () {
this.rotation = null;
this.scale = new THREE.Vector2();
this.color = null;
this.material = null;
};
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册