home/three.js
2
0
Fork 0
mirror of https://github.com/wahyd4/three.js.git synced 2026-08-09 04:56:01 +10:00
Code Issues Packages Projects Releases Wiki Activity

CanvasRenderer: Added distance(falloff) to PointLight. Removed illumination to ParticleCanvasMaterial.

Browse Source
This commit is contained in:
Mr.doob
2011-03-29 03:50:04 +01:00
parent 377d1904de
commit 449a981925
14 changed files with 69 additions and 88 deletions
Download Patch File Download Diff File Expand all files Collapse all files
examples/canvas_interactive_cubes.html
+1 -2
View File
@@ -69,9 +69,8 @@
particleMaterial = new THREE.ParticleCanvasMaterial( {
color: 0x000000,
program: function ( context, color ) {
program: function ( context ) {
context.fillStyle = color.__styleString;
context.beginPath();
context.arc( 0, 0, 1, 0, PI2, true );
context.closePath();
examples/canvas_lights_pointlights.html
+4 -5
View File
@@ -64,19 +64,18 @@
scene.addLight( new THREE.AmbientLight( 0x00020 ) );
light1 = new THREE.PointLight( 0xff0040 );
light1 = new THREE.PointLight( 0xff0040, 1, 50 );
scene.addLight( light1 );
light2 = new THREE.PointLight( 0x0040ff );
light2 = new THREE.PointLight( 0x0040ff, 1, 50 );
scene.addLight( light2 );
light3 = new THREE.PointLight( 0x80ff80 );
light3 = new THREE.PointLight( 0x80ff80, 1, 50 );
scene.addLight( light3 );
var PI2 = Math.PI * 2;
var program = function ( context, color ) {
var program = function ( context ) {
context.fillStyle = color.__styleString;
context.beginPath();
context.arc( 0, 0, 1, 0, PI2, true );
context.closePath();
examples/canvas_lights_pointlights_smooth.html
+4 -5
View File
@@ -64,19 +64,18 @@
scene.addLight( new THREE.AmbientLight( 0x00020 ) );
light1 = new THREE.PointLight( 0xff0040 );
light1 = new THREE.PointLight( 0xff0040, 1, 50 );
scene.addLight( light1 );
light2 = new THREE.PointLight( 0x0040ff );
light2 = new THREE.PointLight( 0x0040ff, 1, 50 );
scene.addLight( light2 );
light3 = new THREE.PointLight( 0x80ff80 );
light3 = new THREE.PointLight( 0x80ff80, 1, 50 );
scene.addLight( light3 );
var PI2 = Math.PI * 2;
var program = function ( context, color ) {
var program = function ( context ) {
context.fillStyle = color.__styleString;
context.beginPath();
context.arc( 0, 0, 1, 0, PI2, true );
context.closePath();
examples/canvas_lines.html
+7 -8
View File
@@ -60,16 +60,15 @@
var PI2 = Math.PI * 2;
var material = new THREE.ParticleCanvasMaterial( {
color: 0xffffff,
program: function ( context, color ) {
color: 0xffffff,
program: function ( context ) {
context.fillStyle = color.__styleString;
context.beginPath();
context.arc( 0, 0, 1, 0, PI2, true );
context.closePath();
context.fill();
context.beginPath();
context.arc( 0, 0, 1, 0, PI2, true );
context.closePath();
context.fill();
}
}
} );
examples/canvas_lines_sphere.html
+7 -8
View File
@@ -63,16 +63,15 @@
var PI2 = Math.PI * 2;
var material = new THREE.ParticleCanvasMaterial( {
color: 0xffffff,
program: function ( context, color ) {
color: 0xffffff,
program: function ( context ) {
context.fillStyle = color.__styleString;
context.beginPath();
context.arc( 0, 0, 1, 0, PI2, true );
context.closePath();
context.fill();
context.beginPath();
context.arc( 0, 0, 1, 0, PI2, true );
context.closePath();
context.fill();
}
}
} );
examples/canvas_materials.html
+1 -2
View File
@@ -112,9 +112,8 @@
}
var PI2 = Math.PI * 2;
var program = function ( context, color ) {
var program = function ( context ) {
context.fillStyle = color.__styleString;
context.beginPath();
context.arc( 0, 0, 1, 0, PI2, true );
context.closePath();
examples/canvas_materials_video.html
+7 -8
View File
@@ -128,16 +128,15 @@
var PI2 = Math.PI * 2;
var material = new THREE.ParticleCanvasMaterial( {
color: 0x0808080,
program: function ( context, color ) {
color: 0x0808080,
program: function ( context ) {
context.fillStyle = color.__styleString;
context.beginPath();
context.arc( 0, 0, 1, 0, PI2, true );
context.closePath();
context.fill();
context.beginPath();
context.arc( 0, 0, 1, 0, PI2, true );
context.closePath();
context.fill();
}
}
} );
examples/canvas_particles_floor.html
+1 -2
View File
@@ -53,9 +53,8 @@
var material = new THREE.ParticleCanvasMaterial( {
color: 0xffffff,
program: function ( context, color ) {
program: function ( context ) {
context.fillStyle = color.__styleString;
context.beginPath();
context.arc( 0, 0, 1, 0, PI2, true );
context.closePath();
examples/canvas_particles_random.html
+1 -2
View File
@@ -46,9 +46,8 @@
scene = new THREE.Scene();
var PI2 = Math.PI * 2;
var program = function ( context, color ) {
var program = function ( context ) {
context.fillStyle = color.__styleString;
context.beginPath();
context.arc( 0, 0, 1, 0, PI2, true );
context.closePath();
examples/canvas_particles_waves.html
+7 -8
View File
@@ -54,16 +54,15 @@
var PI2 = Math.PI * 2;
var material = new THREE.ParticleCanvasMaterial( {
color: 0xffffff,
program: function ( context, color ) {
color: 0xffffff,
program: function ( context ) {
context.strokeStyle = color.__styleString;
context.beginPath();
context.arc( 0, 0, 1, 0, PI2, true );
context.closePath();
context.stroke();
context.beginPath();
context.arc( 0, 0, 1, 0, PI2, true );
context.closePath();
context.stroke();
}
}
} );
examples/canvas_performance.html
+1 -1
View File
@@ -100,7 +100,7 @@
directionalLight.position.z = 0;
scene.addLight( directionalLight );
var pointLight = new THREE.PointLight( 0xff0000, 1 );
var pointLight = new THREE.PointLight( 0xff0000, 1, 500 );
scene.addLight( pointLight );
renderer = new THREE.CanvasRenderer();
src/lights/DirectionalLight.js
+2 -1
View File
@@ -2,12 +2,13 @@
* @author mr.doob / http://mrdoob.com/
*/
THREE.DirectionalLight = function ( hex, intensity ) {
THREE.DirectionalLight = function ( hex, intensity, distance ) {
THREE.Light.call( this, hex );
this.position = new THREE.Vector3( 0, 1, 0 );
this.intensity = intensity || 1;
this.distance = distance || 0;
};
src/lights/PointLight.js
+2 -1
View File
@@ -2,12 +2,13 @@
* @author mr.doob / http://mrdoob.com/
*/
THREE.PointLight = function ( hex, intensity ) {
THREE.PointLight = function ( hex, intensity, distance ) {
THREE.Light.call( this, hex );
this.position = new THREE.Vector3();
this.intensity = intensity || 1;
this.distance = distance || 0;
};
src/renderers/CanvasRenderer.js
+24 -35
View File
@@ -358,12 +358,16 @@ THREE.CanvasRenderer = function () {
} else if ( light instanceof THREE.DirectionalLight ) {
// for particles
_directionalLights.r += lightColor.r;
_directionalLights.g += lightColor.g;
_directionalLights.b += lightColor.b;
} else if ( light instanceof THREE.PointLight ) {
// for particles
_pointLights.r += lightColor.r;
_pointLights.g += lightColor.g;
_pointLights.b += lightColor.b;
@@ -376,41 +380,41 @@ THREE.CanvasRenderer = function () {
function calculateLight( scene, position, normal, color ) {
var l, ll, light, lightColor, lightIntensity,
var l, ll, light, lightColor,
amount, lights = scene.lights;
for ( l = 0, ll = lights.length; l < ll; l ++ ) {
light = lights[ l ];
lightColor = light.color;
lightIntensity = light.intensity;
if ( light instanceof THREE.DirectionalLight ) {
amount = normal.dot( light.position ) * lightIntensity;
amount = normal.dot( light.position );
if ( amount > 0 ) {
if ( amount <= 0 ) continue;
color.r += lightColor.r * amount;
color.g += lightColor.g * amount;
color.b += lightColor.b * amount;
amount *= light.intensity;
}
color.r += lightColor.r * amount;
color.g += lightColor.g * amount;
color.b += lightColor.b * amount;
} else if ( light instanceof THREE.PointLight ) {
_vector3.sub( light.position, position );
_vector3.normalize();
amount = normal.dot( _vector3.sub( light.position, position ).normalize() );
amount = normal.dot( _vector3 ) * lightIntensity;
if ( amount <= 0 ) continue;
if ( amount > 0 ) {
amount *= light.distance == 0 ? 1 : 1 - Math.min( position.distanceTo( light.position ) / light.distance, 1 );
color.r += lightColor.r * amount;
color.g += lightColor.g * amount;
color.b += lightColor.b * amount;
if ( amount == 0 ) continue;
}
amount *= light.intensity;
color.r += lightColor.r * amount;
color.g += lightColor.g * amount;
color.b += lightColor.b * amount;
}
@@ -475,24 +479,6 @@ THREE.CanvasRenderer = function () {
} else if ( material instanceof THREE.ParticleCanvasMaterial ) {
if ( _enableLighting ) {
_light.r = _ambientLight.r + _directionalLights.r + _pointLights.r;
_light.g = _ambientLight.g + _directionalLights.g + _pointLights.g;
_light.b = _ambientLight.b + _directionalLights.b + _pointLights.b;
_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;
}
width = element.scale.x * _canvasWidthHalf;
height = element.scale.y * _canvasHeightHalf;
@@ -504,12 +490,15 @@ THREE.CanvasRenderer = function () {
}
setStrokeStyle( material.color.__styleString );
setFillStyle( material.color.__styleString );
_context.save();
_context.translate( v1.x, v1.y );
_context.rotate( - element.rotation );
_context.scale( width, height );
material.program( _context, _color );
material.program( _context );
_context.restore();