Bladeren bron

* Bug Fix: Matrix4.makeInvert was calling a non existent scale method. Replaced with multiplyScalar.
* Bug Fix: DirectionalLight wasn't normalizing the direction vector.
* Added lights to the scene for test.html

Nicolas Garcia Belmonte 15 jaren geleden
bovenliggende
commit
10681d6684
4 gewijzigde bestanden met toevoegingen van 26 en 13 verwijderingen
  1. 11 0
      examples/test.html
  2. 1 1
      src/core/Matrix4.js
  3. 2 0
      src/lights/DirectionalLight.js
  4. 12 12
      src/renderers/WebGLRenderer.js

+ 11 - 0
examples/test.html

@@ -40,6 +40,9 @@
 		<script type="text/javascript" src="../src/materials/MeshFaceColorStrokeMaterial.js"></script>
 		<script type="text/javascript" src="../src/materials/ParticleCircleMaterial.js"></script>
 		<script type="text/javascript" src="../src/materials/ParticleBitmapMaterial.js"></script>
+    <script type="text/javascript" src="../src/lights/Light.js"></script>
+    <script type="text/javascript" src="../src/lights/AmbientLight.js"></script>
+    <script type="text/javascript" src="../src/lights/DirectionalLight.js"></script>
 		<script type="text/javascript" src="../src/scenes/Scene.js"></script>
 		<script type="text/javascript" src="../src/renderers/Renderer.js"></script>
 		<script type="text/javascript" src="../src/renderers/CanvasRenderer.js"></script>
@@ -182,6 +185,14 @@
 
 				}
 
+				// LIGHTS
+				
+				var ambient = new THREE.AmbientLight( new THREE.Color( Math.random() * 0xffffff ) );
+        scene.addLight(ambient);
+				var directional = new THREE.DirectionalLight( new THREE.Color( Math.random() * 0xffffff ), 
+						new THREE.Vector3( 600, 0, 0 ) );
+        scene.addLight(directional);
+
 				canvasRenderer = new THREE.CanvasRenderer();
 				canvasRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 				container.appendChild( canvasRenderer.domElement );

+ 1 - 1
src/core/Matrix4.js

@@ -316,7 +316,7 @@ THREE.Matrix4.makeInvert = function ( m1 ) {
 	m2.n42 = m1.n12*m1.n33*m1.n41 - m1.n13*m1.n32*m1.n41 + m1.n13*m1.n31*m1.n42 - m1.n11*m1.n33*m1.n42 - m1.n12*m1.n31*m1.n43 + m1.n11*m1.n32*m1.n43;
 	m2.n43 = m1.n13*m1.n22*m1.n41 - m1.n12*m1.n23*m1.n41 - m1.n13*m1.n21*m1.n42 + m1.n11*m1.n23*m1.n42 + m1.n12*m1.n21*m1.n43 - m1.n11*m1.n22*m1.n43;
 	m2.n44 = m1.n12*m1.n23*m1.n31 - m1.n13*m1.n22*m1.n31 + m1.n13*m1.n21*m1.n32 - m1.n11*m1.n23*m1.n32 - m1.n12*m1.n21*m1.n33 + m1.n11*m1.n22*m1.n33;
-	m2.scale( 1 / m1.determinant() );
+	m2.multiplyScalar( 1 / m1.determinant() );
 
 	return m2;
 

+ 2 - 0
src/lights/DirectionalLight.js

@@ -3,6 +3,8 @@ THREE.DirectionalLight = function(color, direction) {
   THREE.Light.call(this, color);
   
   this.direction = direction || new Vector3(1, 1, 1);
+  
+  this.direction.normalize();
 
 };
 

+ 12 - 12
src/renderers/WebGLRenderer.js

@@ -94,9 +94,9 @@ THREE.WebGLRenderer = function () {
 							vertexArray.push( v2.x, v2.y, v2.z );
 							vertexArray.push( v3.x, v3.y, v3.z );
 
-              normalArray.push( n.x, n.y, n.z );
-              normalArray.push( n.x, n.y, n.z );
-              normalArray.push( n.x, n.y, n.z );
+              normalArray.push( normal.x, normal.y, normal.z );
+              normalArray.push( normal.x, normal.y, normal.z );
+              normalArray.push( normal.x, normal.y, normal.z );
 
 							colorArray.push( faceColor.r, faceColor.g, faceColor.b, faceColor.a );
 							colorArray.push( faceColor.r, faceColor.g, faceColor.b, faceColor.a );
@@ -118,10 +118,10 @@ THREE.WebGLRenderer = function () {
 							vertexArray.push( v3.x, v3.y, v3.z );
 							vertexArray.push( v4.x, v4.y, v4.z );
 
-              normalArray.push( n.x, n.y, n.z );
-              normalArray.push( n.x, n.y, n.z );
-              normalArray.push( n.x, n.y, n.z );
-              normalArray.push( n.x, n.y, n.z );
+              normalArray.push( normal.x, normal.y, normal.z );
+              normalArray.push( normal.x, normal.y, normal.z );
+              normalArray.push( normal.x, normal.y, normal.z );
+              normalArray.push( normal.x, normal.y, normal.z );
 
 							colorArray.push( faceColor.r, faceColor.g, faceColor.b, faceColor.a );
 							colorArray.push( faceColor.r, faceColor.g, faceColor.b, faceColor.a );
@@ -167,7 +167,7 @@ THREE.WebGLRenderer = function () {
 				_program.viewMatrixArray = new Float32Array( viewMatrix.flatten() );
 				_program.projectionMatrixArray = new Float32Array( camera.projectionMatrix.flatten() );
 
-		    normalMatrix = Matrix4.makeInvert(viewMatrix).transpose();
+		    normalMatrix =  THREE.Matrix4.makeInvert(viewMatrix).transpose();
 		    _program.normalMatrixArray = new Float32Array( normalMatrix.flatten() );
 		    
 				_gl.uniformMatrix4fv( _program.viewMatrix, false, _program.viewMatrixArray );
@@ -315,10 +315,10 @@ THREE.WebGLRenderer = function () {
 		_program.projectionMatrix = _gl.getUniformLocation( _program, "projectionMatrix" );
 		_program.normalMatrix = _gl.getUniformLocation( _program, "normalMatrix" );
 
-    _program.enableLighting = _gl.getUniformLocation(program, 'enableLighting');
-    _program.ambientColor = _gl.getUniformLocation(program, 'ambientColor');
-    _program.directionalColor = _gl.getUniformLocation(program, 'directionalColor');
-    _program.lightingDirection = _gl.getUniformLocation(program, 'lightingDirection');
+    _program.enableLighting = _gl.getUniformLocation(_program, 'enableLighting');
+    _program.ambientColor = _gl.getUniformLocation(_program, 'ambientColor');
+    _program.directionalColor = _gl.getUniformLocation(_program, 'directionalColor');
+    _program.lightingDirection = _gl.getUniformLocation(_program, 'lightingDirection');
     
 		_program.color = _gl.getAttribLocation( _program, "color" );
 		_gl.enableVertexAttribArray( _program.color );