KTX2Loader.js 27 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039
  1. /**
  2. * Loader for KTX 2.0 GPU Texture containers.
  3. *
  4. * KTX 2.0 is a container format for various GPU texture formats. The loader
  5. * supports Basis Universal GPU textures, which can be quickly transcoded to
  6. * a wide variety of GPU texture compression formats, as well as some
  7. * uncompressed DataTexture and Data3DTexture formats.
  8. *
  9. * References:
  10. * - KTX: http://github.khronos.org/KTX-Specification/
  11. * - DFD: https://www.khronos.org/registry/DataFormat/specs/1.3/dataformat.1.3.html#basicdescriptor
  12. * - BasisU HDR: https://github.com/BinomialLLC/basis_universal/wiki/UASTC-HDR-Texture-Specification-v1.0
  13. */
  14. import {
  15. CompressedTexture,
  16. CompressedArrayTexture,
  17. CompressedCubeTexture,
  18. Data3DTexture,
  19. DataTexture,
  20. FileLoader,
  21. FloatType,
  22. HalfFloatType,
  23. NoColorSpace,
  24. LinearFilter,
  25. LinearMipmapLinearFilter,
  26. LinearSRGBColorSpace,
  27. Loader,
  28. RedFormat,
  29. RGB_BPTC_UNSIGNED_Format,
  30. RGB_ETC1_Format,
  31. RGB_ETC2_Format,
  32. RGB_PVRTC_4BPPV1_Format,
  33. RGBA_ASTC_4x4_Format,
  34. RGBA_ASTC_6x6_Format,
  35. RGBA_BPTC_Format,
  36. RGBA_ETC2_EAC_Format,
  37. RGBA_PVRTC_4BPPV1_Format,
  38. RGBA_S3TC_DXT5_Format,
  39. RGBA_S3TC_DXT1_Format,
  40. RGBAFormat,
  41. RGFormat,
  42. SRGBColorSpace,
  43. UnsignedByteType,
  44. } from 'three';
  45. import { WorkerPool } from '../utils/WorkerPool.js';
  46. import {
  47. read,
  48. KHR_DF_FLAG_ALPHA_PREMULTIPLIED,
  49. KHR_DF_TRANSFER_SRGB,
  50. KHR_SUPERCOMPRESSION_NONE,
  51. KHR_SUPERCOMPRESSION_ZSTD,
  52. VK_FORMAT_UNDEFINED,
  53. VK_FORMAT_R16_SFLOAT,
  54. VK_FORMAT_R16G16_SFLOAT,
  55. VK_FORMAT_R16G16B16A16_SFLOAT,
  56. VK_FORMAT_R32_SFLOAT,
  57. VK_FORMAT_R32G32_SFLOAT,
  58. VK_FORMAT_R32G32B32A32_SFLOAT,
  59. VK_FORMAT_R8_SRGB,
  60. VK_FORMAT_R8_UNORM,
  61. VK_FORMAT_R8G8_SRGB,
  62. VK_FORMAT_R8G8_UNORM,
  63. VK_FORMAT_R8G8B8A8_SRGB,
  64. VK_FORMAT_R8G8B8A8_UNORM,
  65. VK_FORMAT_ASTC_4x4_SFLOAT_BLOCK_EXT,
  66. VK_FORMAT_ASTC_6x6_SRGB_BLOCK,
  67. VK_FORMAT_ASTC_6x6_UNORM_BLOCK,
  68. KHR_DF_PRIMARIES_UNSPECIFIED,
  69. KHR_DF_PRIMARIES_BT709,
  70. KHR_DF_PRIMARIES_DISPLAYP3
  71. } from '../libs/ktx-parse.module.js';
  72. import { ZSTDDecoder } from '../libs/zstddec.module.js';
  73. import { DisplayP3ColorSpace, LinearDisplayP3ColorSpace } from '../math/ColorSpaces.js';
  74. const _taskCache = new WeakMap();
  75. let _activeLoaders = 0;
  76. let _zstd;
  77. class KTX2Loader extends Loader {
  78. constructor( manager ) {
  79. super( manager );
  80. this.transcoderPath = '';
  81. this.transcoderBinary = null;
  82. this.transcoderPending = null;
  83. this.workerPool = new WorkerPool();
  84. this.workerSourceURL = '';
  85. this.workerConfig = null;
  86. if ( typeof MSC_TRANSCODER !== 'undefined' ) {
  87. console.warn(
  88. 'THREE.KTX2Loader: Please update to latest "basis_transcoder".'
  89. + ' "msc_basis_transcoder" is no longer supported in three.js r125+.'
  90. );
  91. }
  92. }
  93. setTranscoderPath( path ) {
  94. this.transcoderPath = path;
  95. return this;
  96. }
  97. setWorkerLimit( num ) {
  98. this.workerPool.setWorkerLimit( num );
  99. return this;
  100. }
  101. async detectSupportAsync( renderer ) {
  102. this.workerConfig = {
  103. astcSupported: await renderer.hasFeatureAsync( 'texture-compression-astc' ),
  104. astcHDRSupported: false, // https://github.com/gpuweb/gpuweb/issues/3856
  105. etc1Supported: await renderer.hasFeatureAsync( 'texture-compression-etc1' ),
  106. etc2Supported: await renderer.hasFeatureAsync( 'texture-compression-etc2' ),
  107. dxtSupported: await renderer.hasFeatureAsync( 'texture-compression-bc' ),
  108. bptcSupported: await renderer.hasFeatureAsync( 'texture-compression-bptc' ),
  109. pvrtcSupported: await renderer.hasFeatureAsync( 'texture-compression-pvrtc' )
  110. };
  111. return this;
  112. }
  113. detectSupport( renderer ) {
  114. if ( renderer.isWebGPURenderer === true ) {
  115. this.workerConfig = {
  116. astcSupported: renderer.hasFeature( 'texture-compression-astc' ),
  117. astcHDRSupported: false, // https://github.com/gpuweb/gpuweb/issues/3856
  118. etc1Supported: renderer.hasFeature( 'texture-compression-etc1' ),
  119. etc2Supported: renderer.hasFeature( 'texture-compression-etc2' ),
  120. dxtSupported: renderer.hasFeature( 'texture-compression-bc' ),
  121. bptcSupported: renderer.hasFeature( 'texture-compression-bptc' ),
  122. pvrtcSupported: renderer.hasFeature( 'texture-compression-pvrtc' )
  123. };
  124. } else {
  125. this.workerConfig = {
  126. astcSupported: renderer.extensions.has( 'WEBGL_compressed_texture_astc' ),
  127. astcHDRSupported: renderer.extensions.has( 'WEBGL_compressed_texture_astc' )
  128. && renderer.extensions.get( 'WEBGL_compressed_texture_astc' ).getSupportedProfiles().includes( 'hdr' ),
  129. etc1Supported: renderer.extensions.has( 'WEBGL_compressed_texture_etc1' ),
  130. etc2Supported: renderer.extensions.has( 'WEBGL_compressed_texture_etc' ),
  131. dxtSupported: renderer.extensions.has( 'WEBGL_compressed_texture_s3tc' ),
  132. bptcSupported: renderer.extensions.has( 'EXT_texture_compression_bptc' ),
  133. pvrtcSupported: renderer.extensions.has( 'WEBGL_compressed_texture_pvrtc' )
  134. || renderer.extensions.has( 'WEBKIT_WEBGL_compressed_texture_pvrtc' )
  135. };
  136. }
  137. return this;
  138. }
  139. init() {
  140. if ( ! this.transcoderPending ) {
  141. // Load transcoder wrapper.
  142. const jsLoader = new FileLoader( this.manager );
  143. jsLoader.setPath( this.transcoderPath );
  144. jsLoader.setWithCredentials( this.withCredentials );
  145. const jsContent = jsLoader.loadAsync( 'basis_transcoder.js' );
  146. // Load transcoder WASM binary.
  147. const binaryLoader = new FileLoader( this.manager );
  148. binaryLoader.setPath( this.transcoderPath );
  149. binaryLoader.setResponseType( 'arraybuffer' );
  150. binaryLoader.setWithCredentials( this.withCredentials );
  151. const binaryContent = binaryLoader.loadAsync( 'basis_transcoder.wasm' );
  152. this.transcoderPending = Promise.all( [ jsContent, binaryContent ] )
  153. .then( ( [ jsContent, binaryContent ] ) => {
  154. const fn = KTX2Loader.BasisWorker.toString();
  155. const body = [
  156. '/* constants */',
  157. 'let _EngineFormat = ' + JSON.stringify( KTX2Loader.EngineFormat ),
  158. 'let _EngineType = ' + JSON.stringify( KTX2Loader.EngineType ),
  159. 'let _TranscoderFormat = ' + JSON.stringify( KTX2Loader.TranscoderFormat ),
  160. 'let _BasisFormat = ' + JSON.stringify( KTX2Loader.BasisFormat ),
  161. '/* basis_transcoder.js */',
  162. jsContent,
  163. '/* worker */',
  164. fn.substring( fn.indexOf( '{' ) + 1, fn.lastIndexOf( '}' ) )
  165. ].join( '\n' );
  166. this.workerSourceURL = URL.createObjectURL( new Blob( [ body ] ) );
  167. this.transcoderBinary = binaryContent;
  168. this.workerPool.setWorkerCreator( () => {
  169. const worker = new Worker( this.workerSourceURL );
  170. const transcoderBinary = this.transcoderBinary.slice( 0 );
  171. worker.postMessage( { type: 'init', config: this.workerConfig, transcoderBinary }, [ transcoderBinary ] );
  172. return worker;
  173. } );
  174. } );
  175. if ( _activeLoaders > 0 ) {
  176. // Each instance loads a transcoder and allocates workers, increasing network and memory cost.
  177. console.warn(
  178. 'THREE.KTX2Loader: Multiple active KTX2 loaders may cause performance issues.'
  179. + ' Use a single KTX2Loader instance, or call .dispose() on old instances.'
  180. );
  181. }
  182. _activeLoaders ++;
  183. }
  184. return this.transcoderPending;
  185. }
  186. load( url, onLoad, onProgress, onError ) {
  187. if ( this.workerConfig === null ) {
  188. throw new Error( 'THREE.KTX2Loader: Missing initialization with `.detectSupport( renderer )`.' );
  189. }
  190. const loader = new FileLoader( this.manager );
  191. loader.setResponseType( 'arraybuffer' );
  192. loader.setWithCredentials( this.withCredentials );
  193. loader.load( url, ( buffer ) => {
  194. this.parse( buffer, onLoad, onError );
  195. }, onProgress, onError );
  196. }
  197. parse( buffer, onLoad, onError ) {
  198. if ( this.workerConfig === null ) {
  199. throw new Error( 'THREE.KTX2Loader: Missing initialization with `.detectSupport( renderer )`.' );
  200. }
  201. // Check for an existing task using this buffer. A transferred buffer cannot be transferred
  202. // again from this thread.
  203. if ( _taskCache.has( buffer ) ) {
  204. const cachedTask = _taskCache.get( buffer );
  205. return cachedTask.promise.then( onLoad ).catch( onError );
  206. }
  207. this._createTexture( buffer )
  208. .then( ( texture ) => onLoad ? onLoad( texture ) : null )
  209. .catch( onError );
  210. }
  211. _createTextureFrom( transcodeResult, container ) {
  212. const { type: messageType, error, data: { faces, width, height, format, type, dfdFlags } } = transcodeResult;
  213. if ( messageType === 'error' ) return Promise.reject( error );
  214. let texture;
  215. if ( container.faceCount === 6 ) {
  216. texture = new CompressedCubeTexture( faces, format, type );
  217. } else {
  218. const mipmaps = faces[ 0 ].mipmaps;
  219. texture = container.layerCount > 1
  220. ? new CompressedArrayTexture( mipmaps, width, height, container.layerCount, format, type )
  221. : new CompressedTexture( mipmaps, width, height, format, type );
  222. }
  223. texture.minFilter = faces[ 0 ].mipmaps.length === 1 ? LinearFilter : LinearMipmapLinearFilter;
  224. texture.magFilter = LinearFilter;
  225. texture.generateMipmaps = false;
  226. texture.needsUpdate = true;
  227. texture.colorSpace = parseColorSpace( container );
  228. texture.premultiplyAlpha = !! ( dfdFlags & KHR_DF_FLAG_ALPHA_PREMULTIPLIED );
  229. return texture;
  230. }
  231. /**
  232. * @param {ArrayBuffer} buffer
  233. * @param {?Object} config
  234. * @return {Promise<CompressedTexture|CompressedArrayTexture|DataTexture|Data3DTexture>}
  235. */
  236. async _createTexture( buffer, config = {} ) {
  237. const container = read( new Uint8Array( buffer ) );
  238. // Basis UASTC HDR is a subset of ASTC, which can be transcoded efficiently
  239. // to BC6H. To detect whether a KTX2 file uses Basis UASTC HDR, or default
  240. // ASTC, inspect the DFD color model.
  241. //
  242. // Source: https://github.com/BinomialLLC/basis_universal/issues/381
  243. const isBasisHDR = container.vkFormat === VK_FORMAT_ASTC_4x4_SFLOAT_BLOCK_EXT
  244. && container.dataFormatDescriptor[ 0 ].colorModel === 0xA7;
  245. // If the device supports ASTC, Basis UASTC HDR requires no transcoder.
  246. const needsTranscoder = container.vkFormat === VK_FORMAT_UNDEFINED
  247. || isBasisHDR && ! this.workerConfig.astcHDRSupported;
  248. if ( ! needsTranscoder ) {
  249. return createRawTexture( container );
  250. }
  251. //
  252. const taskConfig = config;
  253. const texturePending = this.init().then( () => {
  254. return this.workerPool.postMessage( { type: 'transcode', buffer, taskConfig: taskConfig }, [ buffer ] );
  255. } ).then( ( e ) => this._createTextureFrom( e.data, container ) );
  256. // Cache the task result.
  257. _taskCache.set( buffer, { promise: texturePending } );
  258. return texturePending;
  259. }
  260. dispose() {
  261. this.workerPool.dispose();
  262. if ( this.workerSourceURL ) URL.revokeObjectURL( this.workerSourceURL );
  263. _activeLoaders --;
  264. return this;
  265. }
  266. }
  267. /* CONSTANTS */
  268. KTX2Loader.BasisFormat = {
  269. ETC1S: 0,
  270. UASTC: 1,
  271. UASTC_HDR: 2,
  272. };
  273. // Source: https://github.com/BinomialLLC/basis_universal/blob/master/webgl/texture_test/index.html
  274. KTX2Loader.TranscoderFormat = {
  275. ETC1: 0,
  276. ETC2: 1,
  277. BC1: 2,
  278. BC3: 3,
  279. BC4: 4,
  280. BC5: 5,
  281. BC7_M6_OPAQUE_ONLY: 6,
  282. BC7_M5: 7,
  283. PVRTC1_4_RGB: 8,
  284. PVRTC1_4_RGBA: 9,
  285. ASTC_4x4: 10,
  286. ATC_RGB: 11,
  287. ATC_RGBA_INTERPOLATED_ALPHA: 12,
  288. RGBA32: 13,
  289. RGB565: 14,
  290. BGR565: 15,
  291. RGBA4444: 16,
  292. BC6H: 22,
  293. RGB_HALF: 24,
  294. RGBA_HALF: 25,
  295. };
  296. KTX2Loader.EngineFormat = {
  297. RGBAFormat: RGBAFormat,
  298. RGBA_ASTC_4x4_Format: RGBA_ASTC_4x4_Format,
  299. RGB_BPTC_UNSIGNED_Format: RGB_BPTC_UNSIGNED_Format,
  300. RGBA_BPTC_Format: RGBA_BPTC_Format,
  301. RGBA_ETC2_EAC_Format: RGBA_ETC2_EAC_Format,
  302. RGBA_PVRTC_4BPPV1_Format: RGBA_PVRTC_4BPPV1_Format,
  303. RGBA_S3TC_DXT5_Format: RGBA_S3TC_DXT5_Format,
  304. RGB_ETC1_Format: RGB_ETC1_Format,
  305. RGB_ETC2_Format: RGB_ETC2_Format,
  306. RGB_PVRTC_4BPPV1_Format: RGB_PVRTC_4BPPV1_Format,
  307. RGBA_S3TC_DXT1_Format: RGBA_S3TC_DXT1_Format,
  308. };
  309. KTX2Loader.EngineType = {
  310. UnsignedByteType: UnsignedByteType,
  311. HalfFloatType: HalfFloatType,
  312. FloatType: FloatType,
  313. };
  314. /* WEB WORKER */
  315. KTX2Loader.BasisWorker = function () {
  316. let config;
  317. let transcoderPending;
  318. let BasisModule;
  319. const EngineFormat = _EngineFormat; // eslint-disable-line no-undef
  320. const EngineType = _EngineType; // eslint-disable-line no-undef
  321. const TranscoderFormat = _TranscoderFormat; // eslint-disable-line no-undef
  322. const BasisFormat = _BasisFormat; // eslint-disable-line no-undef
  323. self.addEventListener( 'message', function ( e ) {
  324. const message = e.data;
  325. switch ( message.type ) {
  326. case 'init':
  327. config = message.config;
  328. init( message.transcoderBinary );
  329. break;
  330. case 'transcode':
  331. transcoderPending.then( () => {
  332. try {
  333. const { faces, buffers, width, height, hasAlpha, format, type, dfdFlags } = transcode( message.buffer );
  334. self.postMessage( { type: 'transcode', id: message.id, data: { faces, width, height, hasAlpha, format, type, dfdFlags } }, buffers );
  335. } catch ( error ) {
  336. console.error( error );
  337. self.postMessage( { type: 'error', id: message.id, error: error.message } );
  338. }
  339. } );
  340. break;
  341. }
  342. } );
  343. function init( wasmBinary ) {
  344. transcoderPending = new Promise( ( resolve ) => {
  345. BasisModule = { wasmBinary, onRuntimeInitialized: resolve };
  346. BASIS( BasisModule ); // eslint-disable-line no-undef
  347. } ).then( () => {
  348. BasisModule.initializeBasis();
  349. if ( BasisModule.KTX2File === undefined ) {
  350. console.warn( 'THREE.KTX2Loader: Please update Basis Universal transcoder.' );
  351. }
  352. } );
  353. }
  354. function transcode( buffer ) {
  355. const ktx2File = new BasisModule.KTX2File( new Uint8Array( buffer ) );
  356. function cleanup() {
  357. ktx2File.close();
  358. ktx2File.delete();
  359. }
  360. if ( ! ktx2File.isValid() ) {
  361. cleanup();
  362. throw new Error( 'THREE.KTX2Loader: Invalid or unsupported .ktx2 file' );
  363. }
  364. let basisFormat;
  365. if ( ktx2File.isUASTC() ) {
  366. basisFormat = BasisFormat.UASTC;
  367. } else if ( ktx2File.isETC1S() ) {
  368. basisFormat = BasisFormat.ETC1S;
  369. } else if ( ktx2File.isHDR() ) {
  370. basisFormat = BasisFormat.UASTC_HDR;
  371. } else {
  372. throw new Error( 'THREE.KTX2Loader: Unknown Basis encoding' );
  373. }
  374. const width = ktx2File.getWidth();
  375. const height = ktx2File.getHeight();
  376. const layerCount = ktx2File.getLayers() || 1;
  377. const levelCount = ktx2File.getLevels();
  378. const faceCount = ktx2File.getFaces();
  379. const hasAlpha = ktx2File.getHasAlpha();
  380. const dfdFlags = ktx2File.getDFDFlags();
  381. const { transcoderFormat, engineFormat, engineType } = getTranscoderFormat( basisFormat, width, height, hasAlpha );
  382. if ( ! width || ! height || ! levelCount ) {
  383. cleanup();
  384. throw new Error( 'THREE.KTX2Loader: Invalid texture' );
  385. }
  386. if ( ! ktx2File.startTranscoding() ) {
  387. cleanup();
  388. throw new Error( 'THREE.KTX2Loader: .startTranscoding failed' );
  389. }
  390. const faces = [];
  391. const buffers = [];
  392. for ( let face = 0; face < faceCount; face ++ ) {
  393. const mipmaps = [];
  394. for ( let mip = 0; mip < levelCount; mip ++ ) {
  395. const layerMips = [];
  396. let mipWidth, mipHeight;
  397. for ( let layer = 0; layer < layerCount; layer ++ ) {
  398. const levelInfo = ktx2File.getImageLevelInfo( mip, layer, face );
  399. if ( face === 0 && mip === 0 && layer === 0 && ( levelInfo.origWidth % 4 !== 0 || levelInfo.origHeight % 4 !== 0 ) ) {
  400. console.warn( 'THREE.KTX2Loader: ETC1S and UASTC textures should use multiple-of-four dimensions.' );
  401. }
  402. if ( levelCount > 1 ) {
  403. mipWidth = levelInfo.origWidth;
  404. mipHeight = levelInfo.origHeight;
  405. } else {
  406. // Handles non-multiple-of-four dimensions in textures without mipmaps. Textures with
  407. // mipmaps must use multiple-of-four dimensions, for some texture formats and APIs.
  408. // See mrdoob/three.js#25908.
  409. mipWidth = levelInfo.width;
  410. mipHeight = levelInfo.height;
  411. }
  412. let dst = new Uint8Array( ktx2File.getImageTranscodedSizeInBytes( mip, layer, 0, transcoderFormat ) );
  413. const status = ktx2File.transcodeImage( dst, mip, layer, face, transcoderFormat, 0, - 1, - 1 );
  414. if ( engineType === EngineType.HalfFloatType ) {
  415. dst = new Uint16Array( dst.buffer, dst.byteOffset, dst.byteLength / Uint16Array.BYTES_PER_ELEMENT );
  416. }
  417. if ( ! status ) {
  418. cleanup();
  419. throw new Error( 'THREE.KTX2Loader: .transcodeImage failed.' );
  420. }
  421. layerMips.push( dst );
  422. }
  423. const mipData = concat( layerMips );
  424. mipmaps.push( { data: mipData, width: mipWidth, height: mipHeight } );
  425. buffers.push( mipData.buffer );
  426. }
  427. faces.push( { mipmaps, width, height, format: engineFormat, type: engineType } );
  428. }
  429. cleanup();
  430. return { faces, buffers, width, height, hasAlpha, dfdFlags, format: engineFormat, type: engineType };
  431. }
  432. //
  433. // Optimal choice of a transcoder target format depends on the Basis format (ETC1S, UASTC, or
  434. // UASTC HDR), device capabilities, and texture dimensions. The list below ranks the formats
  435. // separately for each format. Currently, priority is assigned based on:
  436. //
  437. // high quality > low quality > uncompressed
  438. //
  439. // Prioritization may be revisited, or exposed for configuration, in the future.
  440. //
  441. // Reference: https://github.com/KhronosGroup/3D-Formats-Guidelines/blob/main/KTXDeveloperGuide.md
  442. const FORMAT_OPTIONS = [
  443. {
  444. if: 'astcSupported',
  445. basisFormat: [ BasisFormat.UASTC ],
  446. transcoderFormat: [ TranscoderFormat.ASTC_4x4, TranscoderFormat.ASTC_4x4 ],
  447. engineFormat: [ EngineFormat.RGBA_ASTC_4x4_Format, EngineFormat.RGBA_ASTC_4x4_Format ],
  448. engineType: [ EngineType.UnsignedByteType ],
  449. priorityETC1S: Infinity,
  450. priorityUASTC: 1,
  451. needsPowerOfTwo: false,
  452. },
  453. {
  454. if: 'bptcSupported',
  455. basisFormat: [ BasisFormat.ETC1S, BasisFormat.UASTC ],
  456. transcoderFormat: [ TranscoderFormat.BC7_M5, TranscoderFormat.BC7_M5 ],
  457. engineFormat: [ EngineFormat.RGBA_BPTC_Format, EngineFormat.RGBA_BPTC_Format ],
  458. engineType: [ EngineType.UnsignedByteType ],
  459. priorityETC1S: 3,
  460. priorityUASTC: 2,
  461. needsPowerOfTwo: false,
  462. },
  463. {
  464. if: 'dxtSupported',
  465. basisFormat: [ BasisFormat.ETC1S, BasisFormat.UASTC ],
  466. transcoderFormat: [ TranscoderFormat.BC1, TranscoderFormat.BC3 ],
  467. engineFormat: [ EngineFormat.RGBA_S3TC_DXT1_Format, EngineFormat.RGBA_S3TC_DXT5_Format ],
  468. engineType: [ EngineType.UnsignedByteType ],
  469. priorityETC1S: 4,
  470. priorityUASTC: 5,
  471. needsPowerOfTwo: false,
  472. },
  473. {
  474. if: 'etc2Supported',
  475. basisFormat: [ BasisFormat.ETC1S, BasisFormat.UASTC ],
  476. transcoderFormat: [ TranscoderFormat.ETC1, TranscoderFormat.ETC2 ],
  477. engineFormat: [ EngineFormat.RGB_ETC2_Format, EngineFormat.RGBA_ETC2_EAC_Format ],
  478. engineType: [ EngineType.UnsignedByteType ],
  479. priorityETC1S: 1,
  480. priorityUASTC: 3,
  481. needsPowerOfTwo: false,
  482. },
  483. {
  484. if: 'etc1Supported',
  485. basisFormat: [ BasisFormat.ETC1S, BasisFormat.UASTC ],
  486. transcoderFormat: [ TranscoderFormat.ETC1 ],
  487. engineFormat: [ EngineFormat.RGB_ETC1_Format ],
  488. engineType: [ EngineType.UnsignedByteType ],
  489. priorityETC1S: 2,
  490. priorityUASTC: 4,
  491. needsPowerOfTwo: false,
  492. },
  493. {
  494. if: 'pvrtcSupported',
  495. basisFormat: [ BasisFormat.ETC1S, BasisFormat.UASTC ],
  496. transcoderFormat: [ TranscoderFormat.PVRTC1_4_RGB, TranscoderFormat.PVRTC1_4_RGBA ],
  497. engineFormat: [ EngineFormat.RGB_PVRTC_4BPPV1_Format, EngineFormat.RGBA_PVRTC_4BPPV1_Format ],
  498. engineType: [ EngineType.UnsignedByteType ],
  499. priorityETC1S: 5,
  500. priorityUASTC: 6,
  501. needsPowerOfTwo: true,
  502. },
  503. {
  504. if: 'bptcSupported',
  505. basisFormat: [ BasisFormat.UASTC_HDR ],
  506. transcoderFormat: [ TranscoderFormat.BC6H ],
  507. engineFormat: [ EngineFormat.RGB_BPTC_UNSIGNED_Format ],
  508. engineType: [ EngineType.HalfFloatType ],
  509. priorityHDR: 1,
  510. needsPowerOfTwo: false,
  511. },
  512. // Uncompressed fallbacks.
  513. {
  514. basisFormat: [ BasisFormat.ETC1S, BasisFormat.UASTC ],
  515. transcoderFormat: [ TranscoderFormat.RGBA32, TranscoderFormat.RGBA32 ],
  516. engineFormat: [ EngineFormat.RGBAFormat, EngineFormat.RGBAFormat ],
  517. engineType: [ EngineType.UnsignedByteType, EngineType.UnsignedByteType ],
  518. priorityETC1S: 100,
  519. priorityUASTC: 100,
  520. needsPowerOfTwo: false,
  521. },
  522. {
  523. basisFormat: [ BasisFormat.UASTC_HDR ],
  524. transcoderFormat: [ TranscoderFormat.RGBA_HALF ],
  525. engineFormat: [ EngineFormat.RGBAFormat ],
  526. engineType: [ EngineType.HalfFloatType ],
  527. priorityHDR: 100,
  528. needsPowerOfTwo: false,
  529. }
  530. ];
  531. const OPTIONS = {
  532. // TODO: For ETC1S we intentionally sort by _UASTC_ priority, preserving
  533. // a historical accident shown to avoid performance pitfalls for Linux with
  534. // Firefox & AMD GPU (RadeonSI). Further work needed.
  535. // See https://github.com/mrdoob/three.js/pull/29730.
  536. [ BasisFormat.ETC1S ]: FORMAT_OPTIONS
  537. .filter( ( opt ) => opt.basisFormat.includes( BasisFormat.ETC1S ) )
  538. .sort( ( a, b ) => a.priorityUASTC - b.priorityUASTC ),
  539. [ BasisFormat.UASTC ]: FORMAT_OPTIONS
  540. .filter( ( opt ) => opt.basisFormat.includes( BasisFormat.UASTC ) )
  541. .sort( ( a, b ) => a.priorityUASTC - b.priorityUASTC ),
  542. [ BasisFormat.UASTC_HDR ]: FORMAT_OPTIONS
  543. .filter( ( opt ) => opt.basisFormat.includes( BasisFormat.UASTC_HDR ) )
  544. .sort( ( a, b ) => a.priorityHDR - b.priorityHDR ),
  545. };
  546. function getTranscoderFormat( basisFormat, width, height, hasAlpha ) {
  547. const options = OPTIONS[ basisFormat ];
  548. for ( let i = 0; i < options.length; i ++ ) {
  549. const opt = options[ i ];
  550. if ( opt.if && ! config[ opt.if ] ) continue;
  551. if ( ! opt.basisFormat.includes( basisFormat ) ) continue;
  552. if ( hasAlpha && opt.transcoderFormat.length < 2 ) continue;
  553. if ( opt.needsPowerOfTwo && ! ( isPowerOfTwo( width ) && isPowerOfTwo( height ) ) ) continue;
  554. const transcoderFormat = opt.transcoderFormat[ hasAlpha ? 1 : 0 ];
  555. const engineFormat = opt.engineFormat[ hasAlpha ? 1 : 0 ];
  556. const engineType = opt.engineType[ 0 ];
  557. return { transcoderFormat, engineFormat, engineType };
  558. }
  559. throw new Error( 'THREE.KTX2Loader: Failed to identify transcoding target.' );
  560. }
  561. function isPowerOfTwo( value ) {
  562. if ( value <= 2 ) return true;
  563. return ( value & ( value - 1 ) ) === 0 && value !== 0;
  564. }
  565. /**
  566. * Concatenates N byte arrays.
  567. *
  568. * @param {Uint8Array[]} arrays
  569. * @return {Uint8Array}
  570. */
  571. function concat( arrays ) {
  572. if ( arrays.length === 1 ) return arrays[ 0 ];
  573. let totalByteLength = 0;
  574. for ( let i = 0; i < arrays.length; i ++ ) {
  575. const array = arrays[ i ];
  576. totalByteLength += array.byteLength;
  577. }
  578. const result = new Uint8Array( totalByteLength );
  579. let byteOffset = 0;
  580. for ( let i = 0; i < arrays.length; i ++ ) {
  581. const array = arrays[ i ];
  582. result.set( array, byteOffset );
  583. byteOffset += array.byteLength;
  584. }
  585. return result;
  586. }
  587. };
  588. // Parsing for non-Basis textures. These textures may have supercompression
  589. // like Zstd, but they do not require transcoding.
  590. const UNCOMPRESSED_FORMATS = new Set( [ RGBAFormat, RGFormat, RedFormat ] );
  591. const FORMAT_MAP = {
  592. [ VK_FORMAT_R32G32B32A32_SFLOAT ]: RGBAFormat,
  593. [ VK_FORMAT_R16G16B16A16_SFLOAT ]: RGBAFormat,
  594. [ VK_FORMAT_R8G8B8A8_UNORM ]: RGBAFormat,
  595. [ VK_FORMAT_R8G8B8A8_SRGB ]: RGBAFormat,
  596. [ VK_FORMAT_R32G32_SFLOAT ]: RGFormat,
  597. [ VK_FORMAT_R16G16_SFLOAT ]: RGFormat,
  598. [ VK_FORMAT_R8G8_UNORM ]: RGFormat,
  599. [ VK_FORMAT_R8G8_SRGB ]: RGFormat,
  600. [ VK_FORMAT_R32_SFLOAT ]: RedFormat,
  601. [ VK_FORMAT_R16_SFLOAT ]: RedFormat,
  602. [ VK_FORMAT_R8_SRGB ]: RedFormat,
  603. [ VK_FORMAT_R8_UNORM ]: RedFormat,
  604. [ VK_FORMAT_ASTC_4x4_SFLOAT_BLOCK_EXT ]: RGBA_ASTC_4x4_Format,
  605. [ VK_FORMAT_ASTC_6x6_SRGB_BLOCK ]: RGBA_ASTC_6x6_Format,
  606. [ VK_FORMAT_ASTC_6x6_UNORM_BLOCK ]: RGBA_ASTC_6x6_Format,
  607. };
  608. const TYPE_MAP = {
  609. [ VK_FORMAT_R32G32B32A32_SFLOAT ]: FloatType,
  610. [ VK_FORMAT_R16G16B16A16_SFLOAT ]: HalfFloatType,
  611. [ VK_FORMAT_R8G8B8A8_UNORM ]: UnsignedByteType,
  612. [ VK_FORMAT_R8G8B8A8_SRGB ]: UnsignedByteType,
  613. [ VK_FORMAT_R32G32_SFLOAT ]: FloatType,
  614. [ VK_FORMAT_R16G16_SFLOAT ]: HalfFloatType,
  615. [ VK_FORMAT_R8G8_UNORM ]: UnsignedByteType,
  616. [ VK_FORMAT_R8G8_SRGB ]: UnsignedByteType,
  617. [ VK_FORMAT_R32_SFLOAT ]: FloatType,
  618. [ VK_FORMAT_R16_SFLOAT ]: HalfFloatType,
  619. [ VK_FORMAT_R8_SRGB ]: UnsignedByteType,
  620. [ VK_FORMAT_R8_UNORM ]: UnsignedByteType,
  621. [ VK_FORMAT_ASTC_4x4_SFLOAT_BLOCK_EXT ]: HalfFloatType,
  622. [ VK_FORMAT_ASTC_6x6_SRGB_BLOCK ]: UnsignedByteType,
  623. [ VK_FORMAT_ASTC_6x6_UNORM_BLOCK ]: UnsignedByteType,
  624. };
  625. async function createRawTexture( container ) {
  626. const { vkFormat } = container;
  627. if ( FORMAT_MAP[ vkFormat ] === undefined ) {
  628. throw new Error( 'THREE.KTX2Loader: Unsupported vkFormat.' );
  629. }
  630. //
  631. let zstd;
  632. if ( container.supercompressionScheme === KHR_SUPERCOMPRESSION_ZSTD ) {
  633. if ( ! _zstd ) {
  634. _zstd = new Promise( async ( resolve ) => {
  635. const zstd = new ZSTDDecoder();
  636. await zstd.init();
  637. resolve( zstd );
  638. } );
  639. }
  640. zstd = await _zstd;
  641. }
  642. //
  643. const mipmaps = [];
  644. for ( let levelIndex = 0; levelIndex < container.levels.length; levelIndex ++ ) {
  645. const levelWidth = Math.max( 1, container.pixelWidth >> levelIndex );
  646. const levelHeight = Math.max( 1, container.pixelHeight >> levelIndex );
  647. const levelDepth = container.pixelDepth ? Math.max( 1, container.pixelDepth >> levelIndex ) : 0;
  648. const level = container.levels[ levelIndex ];
  649. let levelData;
  650. if ( container.supercompressionScheme === KHR_SUPERCOMPRESSION_NONE ) {
  651. levelData = level.levelData;
  652. } else if ( container.supercompressionScheme === KHR_SUPERCOMPRESSION_ZSTD ) {
  653. levelData = zstd.decode( level.levelData, level.uncompressedByteLength );
  654. } else {
  655. throw new Error( 'THREE.KTX2Loader: Unsupported supercompressionScheme.' );
  656. }
  657. let data;
  658. if ( TYPE_MAP[ vkFormat ] === FloatType ) {
  659. data = new Float32Array(
  660. levelData.buffer,
  661. levelData.byteOffset,
  662. levelData.byteLength / Float32Array.BYTES_PER_ELEMENT
  663. );
  664. } else if ( TYPE_MAP[ vkFormat ] === HalfFloatType ) {
  665. data = new Uint16Array(
  666. levelData.buffer,
  667. levelData.byteOffset,
  668. levelData.byteLength / Uint16Array.BYTES_PER_ELEMENT
  669. );
  670. } else {
  671. data = levelData;
  672. }
  673. mipmaps.push( {
  674. data: data,
  675. width: levelWidth,
  676. height: levelHeight,
  677. depth: levelDepth,
  678. } );
  679. }
  680. let texture;
  681. if ( UNCOMPRESSED_FORMATS.has( FORMAT_MAP[ vkFormat ] ) ) {
  682. texture = container.pixelDepth === 0
  683. ? new DataTexture( mipmaps[ 0 ].data, container.pixelWidth, container.pixelHeight )
  684. : new Data3DTexture( mipmaps[ 0 ].data, container.pixelWidth, container.pixelHeight, container.pixelDepth );
  685. } else {
  686. if ( container.pixelDepth > 0 ) throw new Error( 'THREE.KTX2Loader: Unsupported pixelDepth.' );
  687. texture = new CompressedTexture( mipmaps, container.pixelWidth, container.pixelHeight );
  688. texture.minFilter = mipmaps.length === 1 ? LinearFilter : LinearMipmapLinearFilter;
  689. texture.magFilter = LinearFilter;
  690. }
  691. texture.mipmaps = mipmaps;
  692. texture.type = TYPE_MAP[ vkFormat ];
  693. texture.format = FORMAT_MAP[ vkFormat ];
  694. texture.colorSpace = parseColorSpace( container );
  695. texture.needsUpdate = true;
  696. //
  697. return Promise.resolve( texture );
  698. }
  699. function parseColorSpace( container ) {
  700. const dfd = container.dataFormatDescriptor[ 0 ];
  701. if ( dfd.colorPrimaries === KHR_DF_PRIMARIES_BT709 ) {
  702. return dfd.transferFunction === KHR_DF_TRANSFER_SRGB ? SRGBColorSpace : LinearSRGBColorSpace;
  703. } else if ( dfd.colorPrimaries === KHR_DF_PRIMARIES_DISPLAYP3 ) {
  704. return dfd.transferFunction === KHR_DF_TRANSFER_SRGB ? DisplayP3ColorSpace : LinearDisplayP3ColorSpace;
  705. } else if ( dfd.colorPrimaries === KHR_DF_PRIMARIES_UNSPECIFIED ) {
  706. return NoColorSpace;
  707. } else {
  708. console.warn( `THREE.KTX2Loader: Unsupported color primaries, "${ dfd.colorPrimaries }"` );
  709. return NoColorSpace;
  710. }
  711. }
  712. export { KTX2Loader };
粤ICP备19079148号