From 3ed8a04c0c9f249e386935392e6bf89fd3b686af Mon Sep 17 00:00:00 2001 From: "Mr.doob" Date: Thu, 20 Aug 2015 18:21:47 -0700 Subject: [PATCH] WebGLRenderer: Implemented MeshFaceMaterial/MultiMaterial. --- src/core/BufferGeometry.js | 40 +++++++++++++++---- src/core/DirectGeometry.js | 39 +++++++++++++++++- src/core/Geometry.js | 12 +++--- .../{MeshFaceMaterial.js => MultiMaterial.js} | 12 ++++-- src/renderers/WebGLRenderer.js | 28 +++++++------ src/renderers/webgl/WebGLBufferRenderer.js | 12 ------ .../webgl/WebGLIndexedBufferRenderer.js | 12 ------ src/renderers/webgl/WebGLShadowMap.js | 11 +++-- utils/build/includes/common.json | 2 +- 9 files changed, 107 insertions(+), 61 deletions(-) rename src/materials/{MeshFaceMaterial.js => MultiMaterial.js} (78%) diff --git a/src/core/BufferGeometry.js b/src/core/BufferGeometry.js index c5a94e39d7..8daf9cc717 100644 --- a/src/core/BufferGeometry.js +++ b/src/core/BufferGeometry.js @@ -16,7 +16,7 @@ THREE.BufferGeometry = function () { this.morphAttributes = {}; - this.drawcalls = []; + this.groups = []; this.boundingBox = null; this.boundingSphere = null; @@ -62,10 +62,17 @@ THREE.BufferGeometry.prototype = { }, + get drawcalls() { + + console.error( 'THREE.BufferGeometry: .drawcalls has been renamed to .groups.' ); + return this.groups; + + }, + get offsets() { - console.warn( 'THREE.BufferGeometry: .offsets has been renamed to .drawcalls.' ); - return this.drawcalls; + console.warn( 'THREE.BufferGeometry: .offsets has been renamed to .groups.' ); + return this.groups; }, @@ -77,18 +84,33 @@ THREE.BufferGeometry.prototype = { } - this.drawcalls.push( { + console.warn( 'THREE.BufferGeometry: .addDrawCall() is now .addGroup().' ); + this.addGroup( start, count ); + + }, + + clearDrawCalls: function () { + + console.warn( 'THREE.BufferGeometry: .clearDrawCalls() is now .clearGroups().' ); + this.clearGroups(); + + }, + + addGroup: function ( start, count, materialIndex ) { + + this.groups.push( { start: start, - count: count + count: count, + materialIndex: materialIndex !== undefined ? materialIndex : 0 } ); }, - clearDrawCalls: function () { + clearGroups: function () { - this.drawcalls = []; + this.groups = []; }, @@ -471,6 +493,10 @@ THREE.BufferGeometry.prototype = { } + // groups + + this.groups = geometry.groups; + // morphs for ( var name in geometry.morphTargets ) { diff --git a/src/core/DirectGeometry.js b/src/core/DirectGeometry.js index 2f67c97704..00844ae22f 100644 --- a/src/core/DirectGeometry.js +++ b/src/core/DirectGeometry.js @@ -19,6 +19,8 @@ THREE.DirectGeometry = function () { this.uvs2 = []; this.tangents = []; + this.groups = []; + this.morphTargets = {}; this.skinWeights = []; @@ -67,7 +69,6 @@ THREE.DirectGeometry.prototype = { }, - fromGeometry: function ( geometry ) { var faces = geometry.faces; @@ -79,6 +80,9 @@ THREE.DirectGeometry.prototype = { var hasTangents = geometry.hasTangents; + var group; + var materialIndex; + // morphs var morphTargets = geometry.morphTargets; @@ -125,7 +129,7 @@ THREE.DirectGeometry.prototype = { // - for ( var i = 0; i < faces.length; i ++ ) { + for ( var i = 0, i3 = 0; i < faces.length; i ++, i3 += 3 ) { var face = faces[ i ]; @@ -195,6 +199,28 @@ THREE.DirectGeometry.prototype = { } + // materials + + if ( face.materialIndex !== materialIndex ) { + + materialIndex = face.materialIndex; + + if ( group !== undefined ) { + + group.count = i3 - group.start; + this.groups.push( group ); + + } + + group = { + start: i3, + materialIndex: materialIndex + }; + + } + + // tangents + if ( hasTangents === true ) { var vertexTangents = face.vertexTangents; @@ -247,6 +273,15 @@ THREE.DirectGeometry.prototype = { } + // + + if ( group !== undefined ) { + + group.count = i3 - group.start; + this.groups.push( group ); + + } + this.verticesNeedUpdate = geometry.verticesNeedUpdate; this.normalsNeedUpdate = geometry.normalsNeedUpdate; this.colorsNeedUpdate = geometry.colorsNeedUpdate; diff --git a/src/core/Geometry.js b/src/core/Geometry.js index ae1a6b4849..b58c691220 100644 --- a/src/core/Geometry.js +++ b/src/core/Geometry.js @@ -299,16 +299,16 @@ THREE.Geometry.prototype = { if ( indices !== undefined ) { - var drawcalls = geometry.drawcalls; + var groups = geometry.groups; - if ( drawcalls.length > 0 ) { + if ( groups.length > 0 ) { - for ( var i = 0; i < drawcalls.length; i ++ ) { + for ( var i = 0; i < groups.length; i ++ ) { - var drawcall = drawcalls[ i ]; + var group = groups[ i ]; - var start = drawcall.start; - var count = drawcall.count; + var start = group.start; + var count = group.count; for ( var j = start, jl = start + count; j < jl; j += 3 ) { diff --git a/src/materials/MeshFaceMaterial.js b/src/materials/MultiMaterial.js similarity index 78% rename from src/materials/MeshFaceMaterial.js rename to src/materials/MultiMaterial.js index fe7bcebbb6..b3e6c0a190 100644 --- a/src/materials/MeshFaceMaterial.js +++ b/src/materials/MultiMaterial.js @@ -2,11 +2,11 @@ * @author mrdoob / http://mrdoob.com/ */ -THREE.MeshFaceMaterial = function ( materials ) { +THREE.MultiMaterial = function ( materials ) { this.uuid = THREE.Math.generateUUID(); - this.type = 'MeshFaceMaterial'; + this.type = 'MultiMaterial'; this.materials = materials instanceof Array ? materials : []; @@ -14,9 +14,9 @@ THREE.MeshFaceMaterial = function ( materials ) { }; -THREE.MeshFaceMaterial.prototype = { +THREE.MultiMaterial.prototype = { - constructor: THREE.MeshFaceMaterial, + constructor: THREE.MultiMaterial, toJSON: function () { @@ -60,3 +60,7 @@ THREE.MeshFaceMaterial.prototype = { } }; + +// backwards compatibility + +THREE.MeshFaceMaterial = THREE.MultiMaterial; diff --git a/src/renderers/WebGLRenderer.js b/src/renderers/WebGLRenderer.js index 88f145147c..4f7e66eedc 100644 --- a/src/renderers/WebGLRenderer.js +++ b/src/renderers/WebGLRenderer.js @@ -759,7 +759,9 @@ THREE.WebGLRenderer = function ( parameters ) { }; - this.renderBufferDirect = function ( camera, lights, fog, geometry, material, object ) { + this.renderBufferDirect = function ( camera, lights, fog, geometry, material, object, group ) { + + if ( material.visible === false ) return; setMaterial( material ); @@ -844,8 +846,6 @@ THREE.WebGLRenderer = function ( parameters ) { } - var groups = geometry.drawcalls; - var renderer; if ( index !== undefined ) { @@ -871,7 +871,7 @@ THREE.WebGLRenderer = function ( parameters ) { } - if ( groups.length === 0 ) { + if ( group === undefined ) { var count; @@ -889,10 +889,10 @@ THREE.WebGLRenderer = function ( parameters ) { } - groups = [ { + group = { start: 0, count: count - } ]; + }; } @@ -919,7 +919,7 @@ THREE.WebGLRenderer = function ( parameters ) { } else { - renderer.renderGroups( groups ); + renderer.render( group.start, group.count ); } @@ -941,12 +941,12 @@ THREE.WebGLRenderer = function ( parameters ) { } - renderer.renderGroups( groups ); + renderer.render( group.start, group.count ); } else if ( object instanceof THREE.PointCloud ) { renderer.setMode( _gl.POINTS ); - renderer.renderGroups( groups ); + renderer.render( group.start, group.count ); } @@ -1381,15 +1381,17 @@ THREE.WebGLRenderer = function ( parameters ) { if ( material instanceof THREE.MeshFaceMaterial ) { + var groups = geometry.groups; var materials = material.materials; - for ( var j = 0, jl = materials.length; j < jl; j ++ ) { + for ( var j = 0, jl = groups.length; j < jl; j ++ ) { - material = materials[ j ]; + var group = groups[ j ]; + var groupMaterial = materials[ group.materialIndex ]; - if ( material.visible ) { + if ( groupMaterial !== undefined ) { - _this.renderBufferDirect( camera, lights, fog, geometry, material, object ); + _this.renderBufferDirect( camera, lights, fog, geometry, groupMaterial, object, group ); } diff --git a/src/renderers/webgl/WebGLBufferRenderer.js b/src/renderers/webgl/WebGLBufferRenderer.js index a0192bfc08..cba9d98637 100644 --- a/src/renderers/webgl/WebGLBufferRenderer.js +++ b/src/renderers/webgl/WebGLBufferRenderer.js @@ -22,17 +22,6 @@ THREE.WebGLBufferRenderer = function ( _gl, extensions, _infoRender ) { } - function renderGroups( groups ) { - - for ( var i = 0, il = groups.length; i < il; i ++ ) { - - var group = groups[ i ]; - render( group.start, group.count ); - - } - - } - function renderInstances( geometry ) { var extension = extensions.get( 'ANGLE_instanced_arrays' ); @@ -60,7 +49,6 @@ THREE.WebGLBufferRenderer = function ( _gl, extensions, _infoRender ) { this.setMode = setMode; this.render = render; - this.renderGroups = renderGroups; this.renderInstances = renderInstances; }; diff --git a/src/renderers/webgl/WebGLIndexedBufferRenderer.js b/src/renderers/webgl/WebGLIndexedBufferRenderer.js index 09a785b227..1e357757d9 100644 --- a/src/renderers/webgl/WebGLIndexedBufferRenderer.js +++ b/src/renderers/webgl/WebGLIndexedBufferRenderer.js @@ -40,17 +40,6 @@ THREE.WebGLIndexedBufferRenderer = function ( _gl, extensions, _infoRender ) { } - function renderGroups( groups ) { - - for ( var i = 0, il = groups.length; i < il; i ++ ) { - - var group = groups[ i ]; - render( group.start, group.count ); - - } - - } - function renderInstances( geometry ) { var extension = extensions.get( 'ANGLE_instanced_arrays' ); @@ -71,7 +60,6 @@ THREE.WebGLIndexedBufferRenderer = function ( _gl, extensions, _infoRender ) { this.setMode = setMode; this.setIndex = setIndex; this.render = render; - this.renderGroups = renderGroups; this.renderInstances = renderInstances; }; diff --git a/src/renderers/webgl/WebGLShadowMap.js b/src/renderers/webgl/WebGLShadowMap.js index 29b87caf2b..b34324430b 100644 --- a/src/renderers/webgl/WebGLShadowMap.js +++ b/src/renderers/webgl/WebGLShadowMap.js @@ -210,15 +210,17 @@ THREE.WebGLShadowMap = function ( _renderer, _lights, _objects ) { if ( material instanceof THREE.MeshFaceMaterial ) { + var groups = geometry.groups; var materials = material.materials; - for ( var k = 0, kl = materials.length; k < kl; k ++ ) { + for ( var j = 0, jl = groups.length; j < jl; j ++ ) { - material = materials[ k ]; + var group = groups[ j ]; + var groupMaterial = materials[ group.materialIndex ]; - if ( material.visible ) { + if ( groupMaterial !== undefined ) { - _renderer.renderBufferDirect( shadowCamera, _lights, null, geometry, getDepthMaterial( object, material ), object ); + _renderer.renderBufferDirect( shadowCamera, _lights, null, geometry, getDepthMaterial( object, groupMaterial ), object, group ); } @@ -281,6 +283,7 @@ THREE.WebGLShadowMap = function ( _renderer, _lights, _objects ) { } + depthMaterial.visible = material.visible; depthMaterial.wireframe = material.wireframe; depthMaterial.wireframeLinewidth = material.wireframeLinewidth; diff --git a/utils/build/includes/common.json b/utils/build/includes/common.json index 70af5639b8..31af254d48 100644 --- a/utils/build/includes/common.json +++ b/utils/build/includes/common.json @@ -66,7 +66,7 @@ "src/materials/MeshPhongMaterial.js", "src/materials/MeshDepthMaterial.js", "src/materials/MeshNormalMaterial.js", - "src/materials/MeshFaceMaterial.js", + "src/materials/MultiMaterial.js", "src/materials/PointCloudMaterial.js", "src/materials/ShaderMaterial.js", "src/materials/RawShaderMaterial.js", -- GitLab