diff --git a/editor/js/Sidebar.Material.js b/editor/js/Sidebar.Material.js index a526e1221a90e971019326e16b4201cbdeadced1..c0ab695033c787143f5fe0280bf2e2aca1ebbb77 100644 --- a/editor/js/Sidebar.Material.js +++ b/editor/js/Sidebar.Material.js @@ -223,6 +223,20 @@ Sidebar.Material = function ( editor ) { container.add( materialNormalMapRow ); + // displacement map + + var materialDisplacementMapRow = new UI.Panel(); + var materialDisplacementMapEnabled = new UI.Checkbox( false ).onChange( update ); + var materialDisplacementMap = new UI.Texture().onChange( update ); + var materialDisplacementScale = new UI.Number( 1 ).setWidth( '30px' ).onChange( update ); + + materialDisplacementMapRow.add( new UI.Text( 'Displace Map' ).setWidth( '90px' ) ); + materialDisplacementMapRow.add( materialDisplacementMapEnabled ); + materialDisplacementMapRow.add( materialDisplacementMap ); + materialDisplacementMapRow.add( materialDisplacementScale ); + + container.add( materialDisplacementMapRow ); + // specular map var materialSpecularMapRow = new UI.Panel(); @@ -517,6 +531,24 @@ Sidebar.Material = function ( editor ) { } + if ( material.displacementMap !== undefined ) { + + var displacementMapEnabled = materialDisplacementMapEnabled.getValue() === true; + + if ( objectHasUvs ) { + + material.displacementMap = displacementMapEnabled ? materialDisplacementMap.getValue() : null; + material.displacementScale = materialDisplacementScale.getValue(); + material.needsUpdate = true; + + } else { + + if ( displacementMapEnabled ) textureWarning = true; + + } + + } + if ( material.specularMap !== undefined ) { var specularMapEnabled = materialSpecularMapEnabled.getValue() === true; @@ -659,6 +691,7 @@ Sidebar.Material = function ( editor ) { 'alphaMap': materialAlphaMapRow, 'bumpMap': materialBumpMapRow, 'normalMap': materialNormalMapRow, + 'displacementMap': materialDisplacementMapRow, 'specularMap': materialSpecularMapRow, 'envMap': materialEnvMapRow, 'lightMap': materialLightMapRow, @@ -787,6 +820,20 @@ Sidebar.Material = function ( editor ) { } + if ( material.displacementMap !== undefined ) { + + materialDisplacementMapEnabled.setValue( material.displacementMap !== null ); + + if ( material.displacementMap !== null || resetTextureSelectors ) { + + materialDisplacementMap.setValue( material.displacementMap ); + + } + + materialDisplacementScale.setValue( material.displacementScale ); + + } + if ( material.specularMap !== undefined ) { materialSpecularMapEnabled.setValue( material.specularMap !== null ); diff --git a/src/loaders/ObjectLoader.js b/src/loaders/ObjectLoader.js index cca26eebca092d2d7ecd33a2f59d0615464fbb27..41089b9a95be8b17a0a7a12f714d62c8047f316f 100755 --- a/src/loaders/ObjectLoader.js +++ b/src/loaders/ObjectLoader.js @@ -341,6 +341,9 @@ THREE.ObjectLoader.prototype = { if ( data.normalMap !== undefined ) material.normalMap = getTexture( data.normalMap ); if ( data.normalScale ) material.normalScale = new THREE.Vector2( data.normalScale, data.normalScale ); + if ( data.displacementMap !== undefined ) material.displacementMap = getTexture( data.displacementMap ); + if ( data.displacementScale !== undefined ) material.displacementScale = data.displacementScale; + if ( data.specularMap !== undefined ) material.specularMap = getTexture( data.specularMap ); if ( data.envMap !== undefined ) { diff --git a/src/materials/Material.js b/src/materials/Material.js index 387c2bbc9f01cd6b189b14cdb409fe874ee2b73d..bdbb546c921a0d2b56cb72b0d96b59ce28e49bf5 100644 --- a/src/materials/Material.js +++ b/src/materials/Material.js @@ -144,6 +144,12 @@ THREE.Material.prototype = { data.normalMap = this.normalMap.toJSON( meta ).uuid; data.normalScale = this.normalScale; // Removed for now, causes issue in editor ui.js + } + if ( this.displacementMap instanceof THREE.Texture ) { + + data.displacementMap = this.displacementMap.toJSON( meta ).uuid; + data.displacementScale = this.displacementScale; + } if ( this.specularMap instanceof THREE.Texture ) data.specularMap = this.specularMap.toJSON( meta ).uuid; if ( this.envMap instanceof THREE.Texture ) { diff --git a/src/materials/MeshPhongMaterial.js b/src/materials/MeshPhongMaterial.js index 43d9b302e2601c923d01213947d008a49abf3cb5..745461445c4231dd6e8af5d6db4f2acbddb2fe85 100644 --- a/src/materials/MeshPhongMaterial.js +++ b/src/materials/MeshPhongMaterial.js @@ -25,6 +25,9 @@ * normalMap: new THREE.Texture( ), * normalScale: , * + * displacementMap: new THREE.Texture( ), + * displacementScale: , + * * specularMap: new THREE.Texture( ), * * alphaMap: new THREE.Texture( ), @@ -81,6 +84,9 @@ THREE.MeshPhongMaterial = function ( parameters ) { this.normalMap = null; this.normalScale = new THREE.Vector2( 1, 1 ); + this.displacementMap = null; + this.displacementScale = 1; + this.specularMap = null; this.alphaMap = null; @@ -139,6 +145,9 @@ THREE.MeshPhongMaterial.prototype.copy = function ( source ) { this.normalMap = source.normalMap; this.normalScale.copy( source.normalScale ); + this.displacementMap = source.displacementMap; + this.displacementScale = source.displacementScale; + this.specularMap = source.specularMap; this.alphaMap = source.alphaMap; diff --git a/src/renderers/WebGLRenderer.js b/src/renderers/WebGLRenderer.js index 48101d84c644d93681dcbcb7fae0c8b2e1f97674..1eb787e6e6c64bc4b3cb21af1d86de53b49c7146 100644 --- a/src/renderers/WebGLRenderer.js +++ b/src/renderers/WebGLRenderer.js @@ -1484,6 +1484,7 @@ THREE.WebGLRenderer = function ( parameters ) { emissiveMap: !! material.emissiveMap, bumpMap: !! material.bumpMap, normalMap: !! material.normalMap, + displacementMap: !! material.displacementMap, specularMap: !! material.specularMap, alphaMap: !! material.alphaMap, @@ -1995,6 +1996,13 @@ THREE.WebGLRenderer = function ( parameters ) { } + if ( material.displacementMap ) { + + uniforms.displacementMap.value = material.displacementMap; + uniforms.displacementScale.value = material.displacementScale; + + } + // uv repeat and offset setting priorities // 1. color map // 2. specular map @@ -2013,6 +2021,10 @@ THREE.WebGLRenderer = function ( parameters ) { uvScaleMap = material.specularMap; + } else if ( material.displacementMap ) { + + uvScaleMap = material.displacementMap; + } else if ( material.normalMap ) { uvScaleMap = material.normalMap; diff --git a/src/renderers/shaders/ShaderChunk/begin_vertex.glsl b/src/renderers/shaders/ShaderChunk/begin_vertex.glsl index ffbb181968de82d6774cb8a9b3b0eac661544ec8..9f681c6600faa8939cb78270258037ab0180d046 100644 --- a/src/renderers/shaders/ShaderChunk/begin_vertex.glsl +++ b/src/renderers/shaders/ShaderChunk/begin_vertex.glsl @@ -1 +1,2 @@ + vec3 transformed = vec3( position ); diff --git a/src/renderers/shaders/ShaderChunk/displacementmap_pars_vertex.glsl b/src/renderers/shaders/ShaderChunk/displacementmap_pars_vertex.glsl new file mode 100644 index 0000000000000000000000000000000000000000..9959d4389909e5d108ed0a59f39607b7e0bb5c19 --- /dev/null +++ b/src/renderers/shaders/ShaderChunk/displacementmap_pars_vertex.glsl @@ -0,0 +1,6 @@ +#ifdef USE_DISPLACEMENTMAP + + uniform sampler2D displacementMap; + uniform float displacementScale; + +#endif diff --git a/src/renderers/shaders/ShaderChunk/displacementmap_vertex.glsl b/src/renderers/shaders/ShaderChunk/displacementmap_vertex.glsl new file mode 100644 index 0000000000000000000000000000000000000000..8033e736a851aa82f2daa77cec26b26d9000e5ee --- /dev/null +++ b/src/renderers/shaders/ShaderChunk/displacementmap_vertex.glsl @@ -0,0 +1,5 @@ +#ifdef USE_DISPLACEMENTMAP + + transformed += objectNormal * texture2D( displacementMap, uv ).x * displacementScale; + +#endif diff --git a/src/renderers/shaders/ShaderLib.js b/src/renderers/shaders/ShaderLib.js index e7a0f10e23906e98933fa5aa91f6083821af0c40..1c352db267a3816a34d7dfd5c025d5a2a0cced6b 100644 --- a/src/renderers/shaders/ShaderLib.js +++ b/src/renderers/shaders/ShaderLib.js @@ -248,8 +248,9 @@ THREE.ShaderLib = { THREE.UniformsLib[ "aomap" ], THREE.UniformsLib[ "lightmap" ], THREE.UniformsLib[ "emissivemap" ], - THREE.UniformsLib[ "bump" ], + THREE.UniformsLib[ "bumpmap" ], THREE.UniformsLib[ "normalmap" ], + THREE.UniformsLib[ "displacementmap" ], THREE.UniformsLib[ "fog" ], THREE.UniformsLib[ "lights" ], THREE.UniformsLib[ "shadowmap" ], @@ -277,6 +278,7 @@ THREE.ShaderLib = { THREE.ShaderChunk[ "common" ], THREE.ShaderChunk[ "uv_pars_vertex" ], THREE.ShaderChunk[ "uv2_pars_vertex" ], + THREE.ShaderChunk[ "displacementmap_pars_vertex" ], THREE.ShaderChunk[ "envmap_pars_vertex" ], THREE.ShaderChunk[ "lights_phong_pars_vertex" ], THREE.ShaderChunk[ "color_pars_vertex" ], @@ -303,6 +305,7 @@ THREE.ShaderLib = { "#endif", THREE.ShaderChunk[ "begin_vertex" ], + THREE.ShaderChunk[ "displacementmap_vertex" ], THREE.ShaderChunk[ "morphtarget_vertex" ], THREE.ShaderChunk[ "skinning_vertex" ], THREE.ShaderChunk[ "project_vertex" ], diff --git a/src/renderers/shaders/UniformsLib.js b/src/renderers/shaders/UniformsLib.js index cf82e4fd6afa4c34c792652a72cf1c45bb059bc2..fd2c94632a0df356a66c3338b28083b50cce7e38 100644 --- a/src/renderers/shaders/UniformsLib.js +++ b/src/renderers/shaders/UniformsLib.js @@ -42,7 +42,7 @@ THREE.UniformsLib = { }, - bump: { + bumpmap: { "bumpMap" : { type: "t", value: null }, "bumpScale" : { type: "f", value: 1 } @@ -53,6 +53,14 @@ THREE.UniformsLib = { "normalMap" : { type: "t", value: null }, "normalScale" : { type: "v2", value: new THREE.Vector2( 1, 1 ) } + + }, + + displacementmap: { + + "displacementMap" : { type: "t", value: null }, + "displacementScale" : { type: "f", value: 1 } + }, fog : { diff --git a/src/renderers/webgl/WebGLProgram.js b/src/renderers/webgl/WebGLProgram.js index e687fda45caa2649326ac6115f9d70bcad2d3191..d925ceb2e7e9a9d331b56a03e54702c2ef93d22b 100644 --- a/src/renderers/webgl/WebGLProgram.js +++ b/src/renderers/webgl/WebGLProgram.js @@ -201,6 +201,7 @@ THREE.WebGLProgram = ( function () { parameters.emissiveMap ? '#define USE_EMISSIVEMAP' : '', parameters.bumpMap ? '#define USE_BUMPMAP' : '', parameters.normalMap ? '#define USE_NORMALMAP' : '', + parameters.displacementMap ? '#define USE_DISPLACEMENTMAP' : '', parameters.specularMap ? '#define USE_SPECULARMAP' : '', parameters.alphaMap ? '#define USE_ALPHAMAP' : '', parameters.vertexColors ? '#define USE_COLOR' : '', diff --git a/utils/build/includes/common.json b/utils/build/includes/common.json index 8a6c1c4243db9e8aa202d81f61bfac7f191047ae..8afd4f757d2b6f4c7ffe68da0d5b957fbd236dd1 100644 --- a/utils/build/includes/common.json +++ b/utils/build/includes/common.json @@ -95,15 +95,16 @@ "src/renderers/shaders/ShaderChunk/alphatest_fragment.glsl", "src/renderers/shaders/ShaderChunk/aomap_fragment.glsl", "src/renderers/shaders/ShaderChunk/aomap_pars_fragment.glsl", + "src/renderers/shaders/ShaderChunk/begin_vertex.glsl", "src/renderers/shaders/ShaderChunk/bumpmap_pars_fragment.glsl", "src/renderers/shaders/ShaderChunk/color_fragment.glsl", "src/renderers/shaders/ShaderChunk/color_pars_fragment.glsl", "src/renderers/shaders/ShaderChunk/color_pars_vertex.glsl", "src/renderers/shaders/ShaderChunk/color_vertex.glsl", "src/renderers/shaders/ShaderChunk/common.glsl", - "src/renderers/shaders/ShaderChunk/begin_vertex.glsl", - "src/renderers/shaders/ShaderChunk/project_vertex.glsl", "src/renderers/shaders/ShaderChunk/defaultnormal_vertex.glsl", + "src/renderers/shaders/ShaderChunk/displacementmap_vertex.glsl", + "src/renderers/shaders/ShaderChunk/displacementmap_pars_vertex.glsl", "src/renderers/shaders/ShaderChunk/emissivemap_fragment.glsl", "src/renderers/shaders/ShaderChunk/emissivemap_pars_fragment.glsl", "src/renderers/shaders/ShaderChunk/envmap_fragment.glsl", @@ -133,6 +134,7 @@ "src/renderers/shaders/ShaderChunk/morphtarget_pars_vertex.glsl", "src/renderers/shaders/ShaderChunk/morphtarget_vertex.glsl", "src/renderers/shaders/ShaderChunk/normalmap_pars_fragment.glsl", + "src/renderers/shaders/ShaderChunk/project_vertex.glsl", "src/renderers/shaders/ShaderChunk/shadowmap_fragment.glsl", "src/renderers/shaders/ShaderChunk/shadowmap_pars_fragment.glsl", "src/renderers/shaders/ShaderChunk/shadowmap_pars_vertex.glsl",