diff --git a/examples/jsm/loaders/KTX2Loader.js b/examples/jsm/loaders/KTX2Loader.js index b2ad541a296a31..15971e805d5ba1 100644 --- a/examples/jsm/loaders/KTX2Loader.js +++ b/examples/jsm/loaders/KTX2Loader.js @@ -229,9 +229,10 @@ class KTX2Loader extends Loader { this.workerConfig = { astcSupported: renderer.hasFeature( 'texture-compression-astc' ), astcHDRSupported: false, // https://github.com/gpuweb/gpuweb/issues/3856 - etc1Supported: renderer.hasFeature( 'texture-compression-etc1' ), + etc1Supported: false, // webgpu support provided by etc2 etc2Supported: renderer.hasFeature( 'texture-compression-etc2' ), - dxtSupported: renderer.hasFeature( 'texture-compression-s3tc' ), + dxtSupported: false, // rgb565 smooth and hard alpha provided by bc (bptc) + rgtcSupported: false, // 1 and 2 channel textures provided by bc (bptc) bptcSupported: renderer.hasFeature( 'texture-compression-bc' ), pvrtcSupported: renderer.hasFeature( 'texture-compression-pvrtc' ) }; @@ -245,6 +246,7 @@ class KTX2Loader extends Loader { etc1Supported: renderer.extensions.has( 'WEBGL_compressed_texture_etc1' ), etc2Supported: renderer.extensions.has( 'WEBGL_compressed_texture_etc' ), dxtSupported: renderer.extensions.has( 'WEBGL_compressed_texture_s3tc' ), + rgtcSupported: renderer.extensions.has( 'EXT_texture_compression_rgtc' ), bptcSupported: renderer.extensions.has( 'EXT_texture_compression_bptc' ), pvrtcSupported: renderer.extensions.has( 'WEBGL_compressed_texture_pvrtc' ) || renderer.extensions.has( 'WEBKIT_WEBGL_compressed_texture_pvrtc' ) diff --git a/examples/textures/ktx2/fail_load.ktx2 b/examples/textures/ktx2/fail_load.ktx2 new file mode 100644 index 00000000000000..92b092d27a3ede Binary files /dev/null and b/examples/textures/ktx2/fail_load.ktx2 differ diff --git a/examples/webgl_loader_texture_ktx2.html b/examples/webgl_loader_texture_ktx2.html index 846c42e9ae865f..0f142f3d23c9c6 100644 --- a/examples/webgl_loader_texture_ktx2.html +++ b/examples/webgl_loader_texture_ktx2.html @@ -86,7 +86,18 @@ import { KTX2Loader } from 'three/addons/loaders/KTX2Loader.js'; - let canvas, renderer; + const canvas = document.getElementById( 'c' ); + + const renderer = new THREE.WebGLRenderer( { canvas, antialias: true } ); + renderer.setClearColor( 0xffffff, 1 ); + renderer.setPixelRatio( window.devicePixelRatio ); + + const loader = new KTX2Loader() + .setTranscoderPath( 'jsm/libs/basis/' ) + .setPath( 'textures/ktx2/' ) + .detectSupport( renderer ); + + const formats = loader.workerConfig; const scenes = []; @@ -110,14 +121,14 @@ + ' reducing memory cost. Requires native support on the device GPU: no single compressed' + ' format is supported on every device.', textures: [ - { path: '2d_astc4x4.ktx2' }, - { path: '2d_etc1.ktx2' }, - { path: '2d_etc2.ktx2' }, - { path: '2d_bc1.ktx2' }, - { path: '2d_bc3.ktx2' }, - { path: '2d_bc4.ktx2' }, - { path: '2d_bc5.ktx2' }, - { path: '2d_bc7.ktx2' }, + { path: '2d_astc4x4.ktx2', supported: formats[ 'astcSupported' ] }, + { path: '2d_etc1.ktx2', supported: formats[ 'etc1Supported' ] }, + { path: '2d_etc2.ktx2', supported: formats[ 'etc2Supported' ] }, + { path: '2d_bc1.ktx2', supported: formats[ 'dxtSupported' ] || formats[ 'bptcSupported' ] }, + { path: '2d_bc3.ktx2', supported: formats[ 'dxtSupported' ] || formats[ 'bptcSupported' ] }, + { path: '2d_bc4.ktx2', supported: formats[ 'rgtcSupported' ] || formats[ 'bptcSupported' ] }, + { path: '2d_bc5.ktx2', supported: formats[ 'rgtcSupported' ] || formats[ 'bptcSupported' ] }, + { path: '2d_bc7.ktx2', supported: formats[ 'bptcSupported' ] } ] }, @@ -138,17 +149,6 @@ async function init() { - canvas = document.getElementById( 'c' ); - - renderer = new THREE.WebGLRenderer( { canvas, antialias: true } ); - renderer.setClearColor( 0xffffff, 1 ); - renderer.setPixelRatio( window.devicePixelRatio ); - - const loader = new KTX2Loader() - .setTranscoderPath( 'jsm/libs/basis/' ) - .setPath( 'textures/ktx2/' ) - .detectSupport( renderer ); - const geometry = flipY( new THREE.PlaneGeometry( 1, 1 ) ); const content = document.getElementById( 'content' ); diff --git a/examples/webgpu_loader_texture_ktx2.html b/examples/webgpu_loader_texture_ktx2.html index e4c8fc307a6c59..5cd292fe5893e5 100644 --- a/examples/webgpu_loader_texture_ktx2.html +++ b/examples/webgpu_loader_texture_ktx2.html @@ -88,69 +88,78 @@ import { KTX2Loader } from 'three/addons/loaders/KTX2Loader.js'; - let canvas, renderer; + const canvas = document.getElementById( 'c' ); - const scenes = []; + const renderer = new THREE.WebGPURenderer( { canvas, antialias: true, forceWebGL: false } ); + renderer.setClearColor( 0xffffff, 1 ); + renderer.setPixelRatio( window.devicePixelRatio ); - const sections = [ - { - title: 'Uncompressed', - description: 'Uncompressed formats (rgba8, rgba16, rgba32) load as THREE.DataTexture objects.' - + ' Lossless, easy to read/write, uncompressed on GPU, optionally compressed over the network.', - textures: [ - { path: '2d_rgba8.ktx2' }, - { path: '2d_rgba8_linear.ktx2' }, - { path: '2d_rgba16_linear.ktx2' }, - { path: '2d_rgba32_linear.ktx2' }, - { path: '2d_rgb9e5_linear.ktx2' }, - { path: '2d_r11g11b10_linear.ktx2' }, - ] - }, - { - title: 'Compressed', - description: 'Compressed formats (ASTC, BCn, ...) load as THREE.CompressedTexture objects,' - + ' reducing memory cost. Requires native support on the device GPU: no single compressed' - + ' format is supported on every device.', - textures: [ - { path: '2d_astc4x4.ktx2' }, - { path: '2d_etc1.ktx2' }, - { path: '2d_etc2.ktx2' }, - { path: '2d_bc1.ktx2' }, - { path: '2d_bc3.ktx2' }, - { path: '2d_bc4.ktx2' }, - { path: '2d_bc5.ktx2' }, - { path: '2d_bc7.ktx2' }, - ] - }, - - { - title: 'Universal', - description: 'Basis Universal textures are specialized intermediate formats supporting fast' - + ' runtime transcoding into other GPU texture compression formats. After transcoding,' - + ' universal textures can be used on any device at reduced memory cost.', - textures: [ - { path: '2d_etc1s.ktx2' }, - { path: '2d_uastc.ktx2' }, - ] - }, - ]; - - init(); + const loader = new KTX2Loader() + .setTranscoderPath( 'jsm/libs/basis/' ) + .setPath( 'textures/ktx2/' ); - async function init() { + const scenes = []; - canvas = document.getElementById( 'c' ); + let sections; - renderer = new THREE.WebGPURenderer( { canvas, antialias: true, forceWebGL: false } ); - renderer.setClearColor( 0xffffff, 1 ); - renderer.setPixelRatio( window.devicePixelRatio ); + initRenderer(); + async function initRenderer() { + await renderer.init(); - const loader = new KTX2Loader() - .setTranscoderPath( 'jsm/libs/basis/' ) - .setPath( 'textures/ktx2/' ) - .detectSupport( renderer ); + loader.detectSupport( renderer ); + + const formats = loader.workerConfig; + + sections = [ + { + title: 'Uncompressed', + description: 'Uncompressed formats (rgba8, rgba16, rgba32) load as THREE.DataTexture objects.' + + ' Lossless, easy to read/write, uncompressed on GPU, optionally compressed over the network.', + textures: [ + { path: '2d_rgba8.ktx2' }, + { path: '2d_rgba8_linear.ktx2' }, + { path: '2d_rgba16_linear.ktx2' }, + { path: '2d_rgba32_linear.ktx2' }, + { path: '2d_rgb9e5_linear.ktx2' }, + { path: '2d_r11g11b10_linear.ktx2' }, + ] + }, + { + title: 'Compressed', + description: 'Compressed formats (ASTC, BCn, ...) load as THREE.CompressedTexture objects,' + + ' reducing memory cost. Requires native support on the device GPU: no single compressed' + + ' format is supported on every device.', + textures: [ + { path: '2d_astc4x4.ktx2', supported: formats[ 'astcSupported' ] }, + { path: '2d_etc1.ktx2', supported: formats[ 'etc2Supported' ] }, + { path: '2d_etc2.ktx2', supported: formats[ 'etc2Supported' ] }, + { path: '2d_bc1.ktx2', supported: formats[ 'bptcSupported' ] }, + { path: '2d_bc3.ktx2', supported: formats[ 'bptcSupported' ] }, + { path: '2d_bc4.ktx2', supported: formats[ 'bptcSupported' ] }, + { path: '2d_bc5.ktx2', supported: formats[ 'bptcSupported' ] }, + { path: '2d_bc7.ktx2', supported: formats[ 'bptcSupported' ] } + ] + }, + + { + title: 'Universal', + description: 'Basis Universal textures are specialized intermediate formats supporting fast' + + ' runtime transcoding into other GPU texture compression formats. After transcoding,' + + ' universal textures can be used on any device at reduced memory cost.', + textures: [ + { path: '2d_etc1s.ktx2' }, + { path: '2d_uastc.ktx2' }, + ] + }, + ]; + + await init(); + + } + + async function init() { const geometry = flipY( new THREE.PlaneGeometry( 1, 1 ) );