Skip to content

Commit

Permalink
Examples: Unified MRT examples.
Browse files Browse the repository at this point in the history
  • Loading branch information
mrdoob committed May 26, 2022
1 parent 90b4954 commit 764cf0f
Show file tree
Hide file tree
Showing 6 changed files with 32 additions and 360 deletions.
1 change: 0 additions & 1 deletion examples/files.json
Original file line number Diff line number Diff line change
Expand Up @@ -300,7 +300,6 @@
"webgl2_materials_texture3d",
"webgl2_materials_texture3d_partialupdate",
"webgl2_multiple_rendertargets",
"webgl2_multiple_rendertargets_multisampled",
"webgl2_multisampled_renderbuffers",
"webgl2_rendertarget_texture2darray",
"webgl2_volume_cloud",
Expand Down
Binary file modified examples/screenshots/webgl2_multiple_rendertargets.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
1 change: 0 additions & 1 deletion examples/tags.json
Original file line number Diff line number Diff line change
Expand Up @@ -93,7 +93,6 @@
"webgl_simple_gi": [ "global illumination" ],
"webgl_tiled_forward": [ "derivatives" ],
"webgl2_multiple_rendertargets": [ "mrt" ],
"webgl2_multiple_rendertargets_multisampled": [ "mrt" ],
"webgl2_multisampled_renderbuffers": [ "msaa" ],
"physics_ammo_cloth": [ "integration" ],
"misc_controls_arcball": [ "rotation" ],
Expand Down
53 changes: 32 additions & 21 deletions examples/webgl2_multiple_rendertargets.html
Original file line number Diff line number Diff line change
Expand Up @@ -99,10 +99,7 @@
</head>
<body>
<div id="info">
<a href="http://threejs.org" target="_blank">threejs</a> - WebGL - Multiple Render Targets<br/>
Renders geometry into a G-Buffer.<br/>
Visualized here is the color and normal data from the G-Buffer.<br/>
Created by <a href="http://twitter.com/mattdesl" target="_blank">@mattdesl</a>.
<a href="http://threejs.org" target="_blank">threejs</a> webgl - Multiple RenderTargets
</div>

<!-- Import maps polyfill -->
Expand All @@ -123,11 +120,22 @@

import WebGL from './jsm/capabilities/WebGL.js';
import { OrbitControls } from './jsm/controls/OrbitControls.js';
import { GUI } from './jsm/libs/lil-gui.module.min.js';

let camera, scene, renderer, controls;
let renderTarget;
let postScene, postCamera;

const parameters = {
samples: 4,
wireframe: false
};

const gui = new GUI();
gui.add( parameters, 'samples', 0, 4 ).step( 1 );
gui.add( parameters, 'wireframe' );
gui.onChange( render );

init();

function init() {
Expand Down Expand Up @@ -168,27 +176,19 @@
// Scene setup

scene = new THREE.Scene();
scene.background = new THREE.Color( 0x222222 );

camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 1, 10 );
camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 0.1, 50 );
camera.position.z = 4;

const diffuse = new THREE.TextureLoader().load(

'textures/brick_diffuse.jpg',

function () {

// ready to render
render();

}

);
const loader = new THREE.TextureLoader();

diffuse.wrapS = diffuse.wrapT = THREE.RepeatWrapping;
const diffuse = loader.load( 'textures/hardwood2_diffuse.jpg', render );
diffuse.wrapS = THREE.RepeatWrapping;
diffuse.wrapT = THREE.RepeatWrapping;

scene.add( new THREE.Mesh(
new THREE.TorusKnotGeometry( 1, 0.3, 128, 64 ),
new THREE.TorusKnotGeometry( 1, 0.3, 128, 32 ),
new THREE.RawShaderMaterial( {
vertexShader: document.querySelector( '#gbuffer-vert' ).textContent.trim(),
fragmentShader: document.querySelector( '#gbuffer-frag' ).textContent.trim(),
Expand Down Expand Up @@ -222,8 +222,7 @@

controls = new OrbitControls( camera, renderer.domElement );
controls.addEventListener( 'change', render );
controls.enableZoom = false;
controls.screenSpacePanning = true;
//controls.enableZoom = false;

window.addEventListener( 'resize', onWindowResize );

Expand All @@ -245,6 +244,18 @@

function render() {

renderTarget.samples = parameters.samples;

scene.traverse( function ( child ) {

if ( child.material !== undefined ) {

child.material.wireframe = parameters.wireframe;

}

} );

// render scene into target
renderer.setRenderTarget( renderTarget );
renderer.render( scene, camera );
Expand Down
Loading

0 comments on commit 764cf0f

Please sign in to comment.