Skip to content

T
three.js

Ablesons / three.js
与 Fork 源项目一致

从无法访问的项目Fork

通知 2
Star 0
Fork 0
T
three.js

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

提交 de2dcdf5 编写于 作者: A alteredq
浏览文件
操作

Changed WebGLRenderTarget / FBO default color format to RGBA. 

This makes lens flares work with postprocessing.

Had to change lines color example to use clearAlpha = 1 to get back bloom.
上级 da0b612c
隐藏空白更改
内联 并排
Showing with 92 addition and 82 deletion
build/Three.js
浏览文件 @ de2dcdf5
......@@ -334,7 +334,7 @@ J;B.__dirtyVertices=!0;B.__dirtyColors=!0}V(u.__webglObjects,B,C)}else if(C inst
e.createBuffer();x.__webglColorBuffer=e.createBuffer();x=B;J=x.vertices.length;x.__vertexArray=new Float32Array(J*3);x.__colorArray=new Float32Array(J*3);x.__sortArray=[];x.__webglParticleCount=J;B.__dirtyVertices=!0;B.__dirtyColors=!0}V(u.__webglObjects,B,C)}else THREE.MarchingCubes!==undefined&&C instanceof THREE.MarchingCubes&&u.__webglObjectsImmediate.push({object:C,opaque:{list:[],count:0},transparent:{list:[],count:0}});n.__objectsAdded.splice(0,1)}for(;n.__objectsRemoved.length;){C=n.__objectsRemoved[0];
u=n;B=void 0;x=void 0;for(B=u.__webglObjects.length-1;B>=0;B--){x=u.__webglObjects[B].object;C==x&&u.__webglObjects.splice(B,1)}n.__objectsRemoved.splice(0,1)}C=0;for(u=n.__webglObjects.length;C<u;C++)G(n.__webglObjects[C].object,n);C=0;for(u=n.__webglShadowVolumes.length;C<u;C++)G(n.__webglShadowVolumes[C].object,n);C=0;for(u=n.__webglLensFlares.length;C<u;C++)G(n.__webglLensFlares[C].object,n);C=0;for(u=n.__webglSprites.length;C<u;C++)G(n.__webglSprites[C].object,n)};this.setFaceCulling=function(n,
C){if(n){!C||C=="ccw"?e.frontFace(e.CCW):e.frontFace(e.CW);if(n=="back")e.cullFace(e.BACK);else n=="front"?e.cullFace(e.FRONT):e.cullFace(e.FRONT_AND_BACK);e.enable(e.CULL_FACE)}else e.disable(e.CULL_FACE)};this.supportsVertexTextures=function(){return e.getParameter(e.MAX_VERTEX_TEXTURE_IMAGE_UNITS)>0}};
THREE.WebGLRenderTarget=function(b,c,d){this.width=b;this.height=c;d=d||{};this.wrapS=d.wrapS!==undefined?d.wrapS:THREE.ClampToEdgeWrapping;this.wrapT=d.wrapT!==undefined?d.wrapT:THREE.ClampToEdgeWrapping;this.magFilter=d.magFilter!==undefined?d.magFilter:THREE.LinearFilter;this.minFilter=d.minFilter!==undefined?d.minFilter:THREE.LinearMipMapLinearFilter;this.format=d.format!==undefined?d.format:THREE.RGBFormat;this.type=d.type!==undefined?d.type:THREE.UnsignedByteType;this.depthBuffer=d.depthBuffer!==
THREE.WebGLRenderTarget=function(b,c,d){this.width=b;this.height=c;d=d||{};this.wrapS=d.wrapS!==undefined?d.wrapS:THREE.ClampToEdgeWrapping;this.wrapT=d.wrapT!==undefined?d.wrapT:THREE.ClampToEdgeWrapping;this.magFilter=d.magFilter!==undefined?d.magFilter:THREE.LinearFilter;this.minFilter=d.minFilter!==undefined?d.minFilter:THREE.LinearMipMapLinearFilter;this.format=d.format!==undefined?d.format:THREE.RGBAFormat;this.type=d.type!==undefined?d.type:THREE.UnsignedByteType;this.depthBuffer=d.depthBuffer!==
undefined?d.depthBuffer:!0;this.stencilBuffer=d.stencilBuffer!==undefined?d.stencilBuffer:!0};
THREE.SoundRenderer=function(){this.volume=1;this.domElement=document.createElement("div");this.domElement.id="THREESound";this.cameraPosition=new THREE.Vector3;this.soundPosition=new THREE.Vector3;this.render=function(b,c,d){d&&b.update(undefined,!1,c);d=b.sounds;var f,g=d.length;for(f=0;f<g;f++){b=d[f];this.soundPosition.set(b.matrixWorld.n14,b.matrixWorld.n24,b.matrixWorld.n34);this.soundPosition.subSelf(c.position);if(b.isPlaying&&b.isLoaded){b.isAddedToDOM||b.addToDOM(this.domElement);b.calculateVolumeAndPan(this.soundPosition)}}}};
THREE.RenderableVertex=function(){this.positionWorld=new THREE.Vector3;this.positionScreen=new THREE.Vector4;this.visible=!0};THREE.RenderableVertex.prototype.copy=function(b){this.positionWorld.copy(b.positionWorld);this.positionScreen.copy(b.positionScreen)};
......
build/custom/ThreeWebGL.js
浏览文件 @ de2dcdf5
......@@ -286,5 +286,5 @@ z;r.__dirtyVertices=!0;r.__dirtyColors=!0}ca(n.__webglObjects,r,s)}else if(s ins
c.createBuffer();m.__webglColorBuffer=c.createBuffer();m=r;z=m.vertices.length;m.__vertexArray=new Float32Array(z*3);m.__colorArray=new Float32Array(z*3);m.__sortArray=[];m.__webglParticleCount=z;r.__dirtyVertices=!0;r.__dirtyColors=!0}ca(n.__webglObjects,r,s)}else THREE.MarchingCubes!==undefined&&s instanceof THREE.MarchingCubes&&n.__webglObjectsImmediate.push({object:s,opaque:{list:[],count:0},transparent:{list:[],count:0}});f.__objectsAdded.splice(0,1)}for(;f.__objectsRemoved.length;){s=f.__objectsRemoved[0];
n=f;r=void 0;m=void 0;for(r=n.__webglObjects.length-1;r>=0;r--){m=n.__webglObjects[r].object;s==m&&n.__webglObjects.splice(r,1)}f.__objectsRemoved.splice(0,1)}s=0;for(n=f.__webglObjects.length;s<n;s++)T(f.__webglObjects[s].object,f);s=0;for(n=f.__webglShadowVolumes.length;s<n;s++)T(f.__webglShadowVolumes[s].object,f);s=0;for(n=f.__webglLensFlares.length;s<n;s++)T(f.__webglLensFlares[s].object,f);s=0;for(n=f.__webglSprites.length;s<n;s++)T(f.__webglSprites[s].object,f)};this.setFaceCulling=function(f,
s){if(f){!s||s=="ccw"?c.frontFace(c.CCW):c.frontFace(c.CW);if(f=="back")c.cullFace(c.BACK);else f=="front"?c.cullFace(c.FRONT):c.cullFace(c.FRONT_AND_BACK);c.enable(c.CULL_FACE)}else c.disable(c.CULL_FACE)};this.supportsVertexTextures=function(){return c.getParameter(c.MAX_VERTEX_TEXTURE_IMAGE_UNITS)>0}};
THREE.WebGLRenderTarget=function(b,d,e){this.width=b;this.height=d;e=e||{};this.wrapS=e.wrapS!==undefined?e.wrapS:THREE.ClampToEdgeWrapping;this.wrapT=e.wrapT!==undefined?e.wrapT:THREE.ClampToEdgeWrapping;this.magFilter=e.magFilter!==undefined?e.magFilter:THREE.LinearFilter;this.minFilter=e.minFilter!==undefined?e.minFilter:THREE.LinearMipMapLinearFilter;this.format=e.format!==undefined?e.format:THREE.RGBFormat;this.type=e.type!==undefined?e.type:THREE.UnsignedByteType;this.depthBuffer=e.depthBuffer!==
THREE.WebGLRenderTarget=function(b,d,e){this.width=b;this.height=d;e=e||{};this.wrapS=e.wrapS!==undefined?e.wrapS:THREE.ClampToEdgeWrapping;this.wrapT=e.wrapT!==undefined?e.wrapT:THREE.ClampToEdgeWrapping;this.magFilter=e.magFilter!==undefined?e.magFilter:THREE.LinearFilter;this.minFilter=e.minFilter!==undefined?e.minFilter:THREE.LinearMipMapLinearFilter;this.format=e.format!==undefined?e.format:THREE.RGBAFormat;this.type=e.type!==undefined?e.type:THREE.UnsignedByteType;this.depthBuffer=e.depthBuffer!==
undefined?e.depthBuffer:!0;this.stencilBuffer=e.stencilBuffer!==undefined?e.stencilBuffer:!0};
examples/webgl_lines_colors.html
浏览文件 @ de2dcdf5
......@@ -60,8 +60,8 @@
camera, scene, renderer, material;
var cameraOrtho, sceneScreen, rtTexture1, rtTexture2, rtTexture3, materialScreen, materialConvolution, blurx, blury, quadScreen;
var postprocessing = { enabled: true };
init();
animate();
......@@ -77,9 +77,9 @@
scene = new THREE.Scene();
renderer = new THREE.WebGLRenderer( { antialias: false } );
renderer = new THREE.WebGLRenderer( { clearColor: 0x000000, clearAlpha: 1, antialias: false } );
renderer.setSize( window.innerWidth, window.innerHeight );
renderer.autoClear = false;
container.appendChild( renderer.domElement );
var geometry = new THREE.Geometry(),
......@@ -132,59 +132,7 @@
}
// postprocessing
cameraOrtho = new THREE.Camera();
cameraOrtho.projectionMatrix = THREE.Matrix4.makeOrtho( window.innerWidth / - 2, window.innerWidth / 2, window.innerHeight / 2, window.innerHeight / - 2, -10000, 10000 );
cameraOrtho.position.z = 100;
sceneScreen = new THREE.Scene();
var pars = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter };
rtTexture1 = new THREE.WebGLRenderTarget( window.innerWidth, window.innerHeight, pars );
rtTexture2 = new THREE.WebGLRenderTarget( 512, 512, pars );
rtTexture3 = new THREE.WebGLRenderTarget( 512, 512, pars );
var screen_shader = ShaderUtils.lib["screen"];
var screen_uniforms = Uniforms.clone( screen_shader.uniforms );
screen_uniforms["tDiffuse"].texture = rtTexture1;
screen_uniforms["opacity"].value = 1.0;
materialScreen = new THREE.MeshShaderMaterial( {
uniforms: screen_uniforms,
vertexShader: screen_shader.vertexShader,
fragmentShader: screen_shader.fragmentShader,
blending: THREE.AdditiveBlending,
transparent: true
} );
var convolution_shader = ShaderUtils.lib["convolution"];
var convolution_uniforms = Uniforms.clone( convolution_shader.uniforms );
blurx = new THREE.Vector2( 0.001953125, 0.0 ),
blury = new THREE.Vector2( 0.0, 0.001953125 );
convolution_uniforms["tDiffuse"].texture = rtTexture1;
convolution_uniforms["uImageIncrement"].value = blurx;
convolution_uniforms["cKernel"].value = ShaderUtils.buildKernel( 4.0 );
materialConvolution = new THREE.MeshShaderMaterial( {
uniforms: convolution_uniforms,
vertexShader: "#define KERNEL_SIZE 25.0\n" + convolution_shader.vertexShader,
fragmentShader: "#define KERNEL_SIZE 25\n" + convolution_shader.fragmentShader
} );
var plane = new Plane( window.innerWidth, window.innerHeight );
quadScreen = new THREE.Mesh( plane, materialConvolution );
quadScreen.position.z = -100;
sceneScreen.addObject( quadScreen );
stats = new Stats();
stats.domElement.style.position = 'absolute';
stats.domElement.style.top = '0px';
......@@ -195,6 +143,9 @@
document.addEventListener( 'touchstart', onDocumentTouchStart, false );
document.addEventListener( 'touchmove', onDocumentTouchMove, false );
initPostprocessing();
renderer.autoClear = false;
}
// port of Processing Java code by Thomas Diewald
......@@ -240,6 +191,59 @@
}
//
function initPostprocessing() {
postprocessing.scene = new THREE.Scene();
postprocessing.camera = new THREE.Camera();
postprocessing.camera.projectionMatrix = THREE.Matrix4.makeOrtho( window.innerWidth / - 2, window.innerWidth / 2, window.innerHeight / 2, window.innerHeight / - 2, -10000, 10000 );
postprocessing.camera.position.z = 100;
var pars = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter };
postprocessing.rtTexture1 = new THREE.WebGLRenderTarget( window.innerWidth, window.innerHeight, pars );
postprocessing.rtTexture2 = new THREE.WebGLRenderTarget( 512, 512, pars );
postprocessing.rtTexture3 = new THREE.WebGLRenderTarget( 512, 512, pars );
var screen_shader = ShaderUtils.lib["screen"];
var screen_uniforms = Uniforms.clone( screen_shader.uniforms );
screen_uniforms["tDiffuse"].texture = postprocessing.rtTexture1;
screen_uniforms["opacity"].value = 1.0;
postprocessing.materialScreen = new THREE.MeshShaderMaterial( {
uniforms: screen_uniforms,
vertexShader: screen_shader.vertexShader,
fragmentShader: screen_shader.fragmentShader,
blending: THREE.AdditiveBlending,
transparent: true
} );
var convolution_shader = ShaderUtils.lib["convolution"];
var convolution_uniforms = Uniforms.clone( convolution_shader.uniforms );
postprocessing.blurx = new THREE.Vector2( 0.001953125, 0.0 ),
postprocessing.blury = new THREE.Vector2( 0.0, 0.001953125 );
convolution_uniforms["tDiffuse"].texture = postprocessing.rtTexture1;
convolution_uniforms["uImageIncrement"].value = postprocessing.blurx;
convolution_uniforms["cKernel"].value = ShaderUtils.buildKernel( 4.0 );
postprocessing.materialConvolution = new THREE.MeshShaderMaterial( {
uniforms: convolution_uniforms,
vertexShader: "#define KERNEL_SIZE 25.0\n" + convolution_shader.vertexShader,
fragmentShader: "#define KERNEL_SIZE 25\n" + convolution_shader.fragmentShader
} );
postprocessing.quad = new THREE.Mesh( new Plane( window.innerWidth, window.innerHeight ), postprocessing.materialConvolution );
postprocessing.quad.position.z = -500;
postprocessing.scene.addObject( postprocessing.quad );
}
function onDocumentMouseMove(event) {
......@@ -283,7 +287,6 @@
camera.position.x += ( mouseX - camera.position.x ) * .05;
camera.position.y += ( - mouseY + 200 - camera.position.y ) * .05;
camera.updateMatrix();
var time = new Date().getTime() * 0.0005;
......@@ -293,43 +296,50 @@
}
//renderer.render( scene, camera );
if ( postprocessing.enabled ) {
renderer.clear();
renderer.clear();
// Render scene into texture
// Render scene into texture
renderer.render( scene, camera, rtTexture1, true );
renderer.render( scene, camera, postprocessing.rtTexture1, true );
// Render quad with blured scene into texture (convolution pass 1)
// Render quad with blured scene into texture (convolution pass 1)
quadScreen.materials = [ materialConvolution ];
postprocessing.quad.materials = [ postprocessing.materialConvolution ];
materialConvolution.uniforms.tDiffuse.texture = rtTexture1;
materialConvolution.uniforms.uImageIncrement.value = blurx;
postprocessing.materialConvolution.uniforms.tDiffuse.texture = postprocessing.rtTexture1;
postprocessing.materialConvolution.uniforms.uImageIncrement.value = postprocessing.blurx;
renderer.render( sceneScreen, cameraOrtho, rtTexture2, true );
renderer.render( postprocessing.scene, postprocessing.camera, postprocessing.rtTexture2, true );
// Render quad with blured scene into texture (convolution pass 2)
// Render quad with blured scene into texture (convolution pass 2)
materialConvolution.uniforms.tDiffuse.texture = rtTexture2;
materialConvolution.uniforms.uImageIncrement.value = blury;
postprocessing.materialConvolution.uniforms.tDiffuse.texture = postprocessing.rtTexture2;
postprocessing.materialConvolution.uniforms.uImageIncrement.value = postprocessing.blury;
renderer.render( sceneScreen, cameraOrtho, rtTexture3, true );
renderer.render( postprocessing.scene, postprocessing.camera, postprocessing.rtTexture3, true );
// Render original scene with superimposed blur to texture
// Render original scene with superimposed blur to texture
quadScreen.materials = [ materialScreen ];
postprocessing.quad.materials = [ postprocessing.materialScreen ];
materialScreen.uniforms.tDiffuse.texture = rtTexture3;
materialScreen.uniforms.opacity.value = 1.3;
postprocessing.materialScreen.uniforms.tDiffuse.texture = postprocessing.rtTexture3;
postprocessing.materialScreen.uniforms.opacity.value = 1.3;
renderer.render( sceneScreen, cameraOrtho, rtTexture1, false );
renderer.render( postprocessing.scene, postprocessing.camera, postprocessing.rtTexture1, false );
// Render to screen
// Render to screen
materialScreen.uniforms.tDiffuse.texture = rtTexture1;
renderer.render( sceneScreen, cameraOrtho );
postprocessing.materialScreen.uniforms.tDiffuse.texture = postprocessing.rtTexture1;
renderer.render( postprocessing.scene, postprocessing.camera );
} else {
renderer.clear();
renderer.render( scene, camera );
}
}
......
src/renderers/WebGLRenderTarget.js
浏览文件 @ de2dcdf5
......@@ -15,7 +15,7 @@ THREE.WebGLRenderTarget = function ( width, height, options ) {
this.magFilter = options.magFilter !== undefined ? options.magFilter : THREE.LinearFilter;
this.minFilter = options.minFilter !== undefined ? options.minFilter : THREE.LinearMipMapLinearFilter;
this.format = options.format !== undefined ? options.format : THREE.RGBFormat;
this.format = options.format !== undefined ? options.format : THREE.RGBAFormat;
this.type = options.type !== undefined ? options.type : THREE.UnsignedByteType;
this.depthBuffer = options.depthBuffer !== undefined ? options.depthBuffer : true;
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或