diff --git a/examples/files.json b/examples/files.json index e334c744b5fa2e..2f8a0d483c19e6 100644 --- a/examples/files.json +++ b/examples/files.json @@ -253,7 +253,6 @@ "webgl_buffergeometry", "webgl_buffergeometry_attributes_integer", "webgl_buffergeometry_attributes_none", - "webgl_buffergeometry_compression", "webgl_buffergeometry_custom_attributes_particles", "webgl_buffergeometry_drawrange", "webgl_buffergeometry_glbufferattribute", diff --git a/examples/jsm/utils/GeometryCompressionUtils.js b/examples/jsm/utils/GeometryCompressionUtils.js index 0be91d568c15bf..31bbaf9718faae 100644 --- a/examples/jsm/utils/GeometryCompressionUtils.js +++ b/examples/jsm/utils/GeometryCompressionUtils.js @@ -11,27 +11,19 @@ import { Matrix4, Vector3 } from 'three'; -import { PackedPhongMaterial } from './PackedPhongMaterial.js'; /** - * Make the input mesh.geometry's normal attribute encoded and compressed by 3 different methods. - * Also will change the mesh.material to `PackedPhongMaterial` which let the vertex shader program decode the normal data. + * Make the input geometry's normal attribute encoded and compressed by 3 different methods. * - * @param {THREE.Mesh} mesh + * @param {THREE.BufferGeometry} geometry * @param {String} encodeMethod "DEFAULT" || "OCT1Byte" || "OCT2Byte" || "ANGLES" * */ -function compressNormals( mesh, encodeMethod ) { +function compressNormals( geometry, encodeMethod ) { - if ( ! mesh.geometry ) { - - console.error( 'Mesh must contain geometry. ' ); - - } - - const normal = mesh.geometry.attributes.normal; + const normal = geometry.attributes.normal; if ( ! normal ) { @@ -66,8 +58,8 @@ function compressNormals( mesh, encodeMethod ) { } - mesh.geometry.setAttribute( 'normal', new BufferAttribute( result, 3, true ) ); - mesh.geometry.attributes.normal.bytes = result.length * 1; + geometry.setAttribute( 'normal', new BufferAttribute( result, 3, true ) ); + geometry.attributes.normal.bytes = result.length * 1; } else if ( encodeMethod == 'OCT1Byte' ) { @@ -88,8 +80,8 @@ function compressNormals( mesh, encodeMethod ) { } - mesh.geometry.setAttribute( 'normal', new BufferAttribute( result, 2, true ) ); - mesh.geometry.attributes.normal.bytes = result.length * 1; + geometry.setAttribute( 'normal', new BufferAttribute( result, 2, true ) ); + geometry.attributes.normal.bytes = result.length * 1; } else if ( encodeMethod == 'OCT2Byte' ) { @@ -104,8 +96,8 @@ function compressNormals( mesh, encodeMethod ) { } - mesh.geometry.setAttribute( 'normal', new BufferAttribute( result, 2, true ) ); - mesh.geometry.attributes.normal.bytes = result.length * 2; + geometry.setAttribute( 'normal', new BufferAttribute( result, 2, true ) ); + geometry.attributes.normal.bytes = result.length * 2; } else if ( encodeMethod == 'ANGLES' ) { @@ -120,8 +112,8 @@ function compressNormals( mesh, encodeMethod ) { } - mesh.geometry.setAttribute( 'normal', new BufferAttribute( result, 2, true ) ); - mesh.geometry.attributes.normal.bytes = result.length * 2; + geometry.setAttribute( 'normal', new BufferAttribute( result, 2, true ) ); + geometry.attributes.normal.bytes = result.length * 2; } else { @@ -129,60 +121,22 @@ function compressNormals( mesh, encodeMethod ) { } - mesh.geometry.attributes.normal.needsUpdate = true; - mesh.geometry.attributes.normal.isPacked = true; - mesh.geometry.attributes.normal.packingMethod = encodeMethod; - - // modify material - if ( ! ( mesh.material instanceof PackedPhongMaterial ) ) { - - mesh.material = new PackedPhongMaterial().copy( mesh.material ); - - } - - if ( encodeMethod == 'ANGLES' ) { - - mesh.material.defines.USE_PACKED_NORMAL = 0; - - } - - if ( encodeMethod == 'OCT1Byte' ) { - - mesh.material.defines.USE_PACKED_NORMAL = 1; - - } - - if ( encodeMethod == 'OCT2Byte' ) { - - mesh.material.defines.USE_PACKED_NORMAL = 1; - - } - - if ( encodeMethod == 'DEFAULT' ) { - - mesh.material.defines.USE_PACKED_NORMAL = 2; - - } + geometry.attributes.normal.needsUpdate = true; + geometry.attributes.normal.isPacked = true; + geometry.attributes.normal.packingMethod = encodeMethod; } /** - * Make the input mesh.geometry's position attribute encoded and compressed. - * Also will change the mesh.material to `PackedPhongMaterial` which let the vertex shader program decode the position data. + * Make the input geometry's position attribute encoded and compressed. * - * @param {THREE.Mesh} mesh + * @param {THREE.BufferGeometry} geometry * */ -function compressPositions( mesh ) { +function compressPositions( geometry ) { - if ( ! mesh.geometry ) { - - console.error( 'Mesh must contain geometry. ' ); - - } - - const position = mesh.geometry.attributes.position; + const position = geometry.attributes.position; if ( ! position ) { @@ -204,47 +158,27 @@ function compressPositions( mesh ) { const result = quantizedEncode( array, encodingBytes ); const quantized = result.quantized; - const decodeMat = result.decodeMat; // IMPORTANT: calculate original geometry bounding info first, before updating packed positions - if ( mesh.geometry.boundingBox == null ) mesh.geometry.computeBoundingBox(); - if ( mesh.geometry.boundingSphere == null ) mesh.geometry.computeBoundingSphere(); + if ( geometry.boundingBox == null ) geometry.computeBoundingBox(); + if ( geometry.boundingSphere == null ) geometry.computeBoundingSphere(); - mesh.geometry.setAttribute( 'position', new BufferAttribute( quantized, 3 ) ); - mesh.geometry.attributes.position.isPacked = true; - mesh.geometry.attributes.position.needsUpdate = true; - mesh.geometry.attributes.position.bytes = quantized.length * encodingBytes; - - // modify material - if ( ! ( mesh.material instanceof PackedPhongMaterial ) ) { - - mesh.material = new PackedPhongMaterial().copy( mesh.material ); - - } - - mesh.material.defines.USE_PACKED_POSITION = 0; - - mesh.material.uniforms.quantizeMatPos.value = decodeMat; - mesh.material.uniforms.quantizeMatPos.needsUpdate = true; + geometry.setAttribute( 'position', new BufferAttribute( quantized, 3 ) ); + geometry.attributes.position.isPacked = true; + geometry.attributes.position.needsUpdate = true; + geometry.attributes.position.bytes = quantized.length * encodingBytes; } /** - * Make the input mesh.geometry's uv attribute encoded and compressed. - * Also will change the mesh.material to `PackedPhongMaterial` which let the vertex shader program decode the uv data. + * Make the input geometry's uv attribute encoded and compressed. * - * @param {THREE.Mesh} mesh + * @param {THREE.BufferGeometry} geometry * */ -function compressUvs( mesh ) { +function compressUvs( geometry ) { - if ( ! mesh.geometry ) { - - console.error( 'Mesh must contain geometry property. ' ); - - } - - const uvs = mesh.geometry.attributes.uv; + const uvs = geometry.attributes.uv; if ( ! uvs ) { @@ -281,39 +215,20 @@ function compressUvs( mesh ) { } - mesh.geometry.setAttribute( 'uv', new BufferAttribute( result, 2, true ) ); - mesh.geometry.attributes.uv.isPacked = true; - mesh.geometry.attributes.uv.needsUpdate = true; - mesh.geometry.attributes.uv.bytes = result.length * 2; - - if ( ! ( mesh.material instanceof PackedPhongMaterial ) ) { - - mesh.material = new PackedPhongMaterial().copy( mesh.material ); - - } - - mesh.material.defines.USE_PACKED_UV = 0; + geometry.setAttribute( 'uv', new BufferAttribute( result, 2, true ) ); + geometry.attributes.uv.isPacked = true; + geometry.attributes.uv.needsUpdate = true; + geometry.attributes.uv.bytes = result.length * 2; } else { // use quantized encoding method result = quantizedEncodeUV( array, 2 ); - mesh.geometry.setAttribute( 'uv', new BufferAttribute( result.quantized, 2 ) ); - mesh.geometry.attributes.uv.isPacked = true; - mesh.geometry.attributes.uv.needsUpdate = true; - mesh.geometry.attributes.uv.bytes = result.quantized.length * 2; - - if ( ! ( mesh.material instanceof PackedPhongMaterial ) ) { - - mesh.material = new PackedPhongMaterial().copy( mesh.material ); - - } - - mesh.material.defines.USE_PACKED_UV = 1; - - mesh.material.uniforms.quantizeMatUV.value = result.decodeMat; - mesh.material.uniforms.quantizeMatUV.needsUpdate = true; + geometry.setAttribute( 'uv', new BufferAttribute( result.quantized, 2 ) ); + geometry.attributes.uv.isPacked = true; + geometry.attributes.uv.needsUpdate = true; + geometry.attributes.uv.bytes = result.quantized.length * 2; } diff --git a/examples/jsm/utils/PackedPhongMaterial.js b/examples/jsm/utils/PackedPhongMaterial.js deleted file mode 100644 index f71aab8e2d8c6b..00000000000000 --- a/examples/jsm/utils/PackedPhongMaterial.js +++ /dev/null @@ -1,178 +0,0 @@ - -/** - * `PackedPhongMaterial` inherited from THREE.MeshPhongMaterial - * - * @param {Object} parameters - */ -import { - MeshPhongMaterial, - ShaderChunk, - ShaderLib, - UniformsUtils, -} from 'three'; - -class PackedPhongMaterial extends MeshPhongMaterial { - - constructor( parameters ) { - - super(); - - this.defines = {}; - this.type = 'PackedPhongMaterial'; - this.uniforms = UniformsUtils.merge( [ - - ShaderLib.phong.uniforms, - - { - quantizeMatPos: { value: null }, - quantizeMatUV: { value: null } - } - - ] ); - - this.vertexShader = [ - '#define PHONG', - - 'varying vec3 vViewPosition;', - - ShaderChunk.common, - ShaderChunk.uv_pars_vertex, - ShaderChunk.displacementmap_pars_vertex, - ShaderChunk.envmap_pars_vertex, - ShaderChunk.color_pars_vertex, - ShaderChunk.fog_pars_vertex, - ShaderChunk.normal_pars_vertex, - ShaderChunk.morphtarget_pars_vertex, - ShaderChunk.skinning_pars_vertex, - ShaderChunk.shadowmap_pars_vertex, - ShaderChunk.logdepthbuf_pars_vertex, - ShaderChunk.clipping_planes_pars_vertex, - - `#ifdef USE_PACKED_NORMAL - #if USE_PACKED_NORMAL == 0 - vec3 decodeNormal(vec3 packedNormal) - { - float x = packedNormal.x * 2.0 - 1.0; - float y = packedNormal.y * 2.0 - 1.0; - vec2 scth = vec2(sin(x * PI), cos(x * PI)); - vec2 scphi = vec2(sqrt(1.0 - y * y), y); - return normalize( vec3(scth.y * scphi.x, scth.x * scphi.x, scphi.y) ); - } - #endif - - #if USE_PACKED_NORMAL == 1 - vec3 decodeNormal(vec3 packedNormal) - { - vec3 v = vec3(packedNormal.xy, 1.0 - abs(packedNormal.x) - abs(packedNormal.y)); - if (v.z < 0.0) - { - v.xy = (1.0 - abs(v.yx)) * vec2((v.x >= 0.0) ? +1.0 : -1.0, (v.y >= 0.0) ? +1.0 : -1.0); - } - return normalize(v); - } - #endif - - #if USE_PACKED_NORMAL == 2 - vec3 decodeNormal(vec3 packedNormal) - { - vec3 v = (packedNormal * 2.0) - 1.0; - return normalize(v); - } - #endif - #endif`, - - `#ifdef USE_PACKED_POSITION - #if USE_PACKED_POSITION == 0 - uniform mat4 quantizeMatPos; - #endif - #endif`, - - `#ifdef USE_PACKED_UV - #if USE_PACKED_UV == 1 - uniform mat3 quantizeMatUV; - #endif - #endif`, - - `#ifdef USE_PACKED_UV - #if USE_PACKED_UV == 0 - vec2 decodeUV(vec2 packedUV) - { - vec2 uv = (packedUV * 2.0) - 1.0; - return uv; - } - #endif - - #if USE_PACKED_UV == 1 - vec2 decodeUV(vec2 packedUV) - { - vec2 uv = ( vec3(packedUV, 1.0) * quantizeMatUV ).xy; - return uv; - } - #endif - #endif`, - - 'void main() {', - - ShaderChunk.uv_vertex, - - `#ifdef USE_MAP - #ifdef USE_PACKED_UV - vMapUv = decodeUV(vMapUv); - #endif - #endif`, - - ShaderChunk.color_vertex, - ShaderChunk.morphcolor_vertex, - - ShaderChunk.beginnormal_vertex, - - `#ifdef USE_PACKED_NORMAL - objectNormal = decodeNormal(objectNormal); - #endif - - #ifdef USE_TANGENT - vec3 objectTangent = vec3( tangent.xyz ); - #endif - `, - - ShaderChunk.morphnormal_vertex, - ShaderChunk.skinbase_vertex, - ShaderChunk.skinnormal_vertex, - ShaderChunk.defaultnormal_vertex, - ShaderChunk.normal_vertex, - - ShaderChunk.begin_vertex, - - `#ifdef USE_PACKED_POSITION - #if USE_PACKED_POSITION == 0 - transformed = ( vec4(transformed, 1.0) * quantizeMatPos ).xyz; - #endif - #endif`, - - ShaderChunk.morphtarget_vertex, - ShaderChunk.skinning_vertex, - ShaderChunk.displacementmap_vertex, - ShaderChunk.project_vertex, - ShaderChunk.logdepthbuf_vertex, - ShaderChunk.clipping_planes_vertex, - - 'vViewPosition = - mvPosition.xyz;', - - ShaderChunk.worldpos_vertex, - ShaderChunk.envmap_vertex, - ShaderChunk.shadowmap_vertex, - ShaderChunk.fog_vertex, - - '}', - ].join( '\n' ); - - // Use the original MeshPhongMaterial's fragmentShader. - this.fragmentShader = ShaderLib.phong.fragmentShader; - - this.setValues( parameters ); - - } - -} - -export { PackedPhongMaterial }; diff --git a/examples/screenshots/webgl_buffergeometry_compression.jpg b/examples/screenshots/webgl_buffergeometry_compression.jpg deleted file mode 100644 index 4da713d915df6a..00000000000000 Binary files a/examples/screenshots/webgl_buffergeometry_compression.jpg and /dev/null differ diff --git a/examples/webgl_buffergeometry_compression.html b/examples/webgl_buffergeometry_compression.html deleted file mode 100644 index 1822acd3b6ec90..00000000000000 --- a/examples/webgl_buffergeometry_compression.html +++ /dev/null @@ -1,273 +0,0 @@ - - - - three.js webgl - buffergeometry - compression - - - - - -
- three.js - BufferGeometry Compression
- Octahedron and Quantization encoding methods from Tarek Sherif -
- - - - - - -