@loaders.gl/gltf 4.0.0-alpha.6 → 4.0.0-alpha.8

package/src/lib/extensions/EXT_texture_webp.ts

@@ -2,11 +2,11 @@
 // https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/EXT_TEXTURE_WEBP
 /* eslint-disable camelcase */
 
-import type {GLTF, GLTF_EXT_texture_webp} from '../types/gltf-types';
+import type {GLTF, GLTF_EXT_texture_webp} from '../types/gltf-json-schema';
 import type {GLTFLoaderOptions} from '../../gltf-loader';
 
 import {isImageFormatSupported} from '@loaders.gl/images';
-import GLTFScenegraph from '../api/gltf-scenegraph';
+import {GLTFScenegraph} from '../api/gltf-scenegraph';
 
 const EXT_TEXTURE_WEBP = 'EXT_texture_webp';
 

package/src/lib/extensions/KHR_binary_gltf.ts

@@ -2,9 +2,9 @@
 // https://github.com/KhronosGroup/glTF/tree/master/extensions/1.0/Khronos/KHR_binary_glTF
 /* eslint-disable camelcase */
 
-import type {GLTF, GLTF_KHR_binary_glTF} from '../types/gltf-types';
+import type {GLTF, GLTF_KHR_binary_glTF} from '../types/gltf-json-schema';
 
-import GLTFScenegraph from '../api/gltf-scenegraph';
+import {GLTFScenegraph} from '../api/gltf-scenegraph';
 
 const KHR_BINARY_GLTF = 'KHR_binary_glTF';
 

package/src/lib/extensions/KHR_draco_mesh_compression.ts

@@ -8,14 +8,14 @@ import type {
   GLTFAccessor,
   GLTFMeshPrimitive,
   GLTF_KHR_draco_mesh_compression
-} from '../types/gltf-types';
+} from '../types/gltf-json-schema';
 import type {GLTFLoaderOptions} from '../../gltf-loader';
 
 import type {LoaderContext} from '@loaders.gl/loader-utils';
 import {DracoLoader} from '@loaders.gl/draco';
 import {DracoLoaderOptions, DracoMesh} from '@loaders.gl/draco';
 import {sliceArrayBuffer} from '@loaders.gl/loader-utils';
-import {default as Scenegraph} from '../api/gltf-scenegraph';
+import {GLTFScenegraph} from '../api/gltf-scenegraph';
 import {getGLTFAccessors, getGLTFAccessor} from '../gltf-utils/gltf-attribute-utils';
 
 const KHR_DRACO_MESH_COMPRESSION = 'KHR_draco_mesh_compression';
@@ -28,7 +28,7 @@ export function preprocess(
   options: GLTFLoaderOptions,
   context: LoaderContext
 ): void {
-  const scenegraph = new Scenegraph(gltfData);
+  const scenegraph = new GLTFScenegraph(gltfData);
   for (const primitive of makeMeshPrimitiveIterator(scenegraph)) {
     if (scenegraph.getObjectExtension(primitive, KHR_DRACO_MESH_COMPRESSION)) {
       // TODO - Remove fallback accessors to make sure we don't load unnecessary buffers
@@ -45,7 +45,7 @@ export async function decode(
     return;
   }
 
-  const scenegraph = new Scenegraph(gltfData);
+  const scenegraph = new GLTFScenegraph(gltfData);
   const promises: Promise<void>[] = [];
   for (const primitive of makeMeshPrimitiveIterator(scenegraph)) {
     if (scenegraph.getObjectExtension(primitive, KHR_DRACO_MESH_COMPRESSION)) {
@@ -61,7 +61,7 @@ export async function decode(
 }
 
 export function encode(gltfData, options: GLTFLoaderOptions = {}): void {
-  const scenegraph = new Scenegraph(gltfData);
+  const scenegraph = new GLTFScenegraph(gltfData);
 
   for (const mesh of scenegraph.json.meshes || []) {
     // eslint-disable-next-line camelcase
@@ -81,7 +81,7 @@ export function encode(gltfData, options: GLTFLoaderOptions = {}): void {
 // TODO - Implement fallback behavior per KHR_DRACO_MESH_COMPRESSION spec
 
 async function decompressPrimitive(
-  scenegraph: Scenegraph,
+  scenegraph: GLTFScenegraph,
   primitive: GLTFMeshPrimitive,
   options: GLTFLoaderOptions,
   context: LoaderContext
@@ -128,7 +128,7 @@ async function decompressPrimitive(
   }
 
   // Extension has been processed, delete it
-  // delete primitive.extensions[KHR_DRACO_MESH_COMPRESSION];
+  scenegraph.removeObjectExtension(primitive, KHR_DRACO_MESH_COMPRESSION);
 
   checkPrimitive(primitive);
 }

package/src/lib/extensions/KHR_texture_basisu.ts

@@ -2,10 +2,10 @@
 // https://github.com/KhronosGroup/glTF/tree/main/extensions/2.0/Khronos/KHR_texture_basisu
 /* eslint-disable camelcase */
 
-import type {GLTF, GLTF_KHR_texture_basisu} from '../types/gltf-types';
+import type {GLTF, GLTF_KHR_texture_basisu} from '../types/gltf-json-schema';
 import type {GLTFLoaderOptions} from '../../gltf-loader';
 
-import GLTFScenegraph from '../api/gltf-scenegraph';
+import {GLTFScenegraph} from '../api/gltf-scenegraph';
 
 const KHR_TEXTURE_BASISU = 'KHR_texture_basisu';
 
@@ -28,8 +28,8 @@ export function preprocess(gltfData: {json: GLTF}, options: GLTFLoaderOptions):
     if (extension) {
       // TODO - if multiple texture extensions are present which one wins?
       texture.source = extension.source;
+      scene.removeObjectExtension(texture, KHR_TEXTURE_BASISU);
     }
-    scene.removeObjectExtension(texture, KHR_TEXTURE_BASISU);
   }
 
   // Remove the top-level extension

package/src/lib/extensions/KHR_texture_transform.ts

@@ -3,18 +3,21 @@
  */
 
 import {Vector3, Matrix3} from '@math.gl/core';
-import type {GLTFMeshPrimitive, GLTFWithBuffers} from '../types/gltf-types';
+import type {GLTFWithBuffers} from '../types/gltf-types';
+import type {
+  GLTFMeshPrimitive,
+  GLTFAccessor,
+  GLTFBufferView,
+  GLTFMaterialNormalTextureInfo,
+  GLTFMaterialOcclusionTextureInfo,
+  GLTFTextureInfo
+} from '../types/gltf-json-schema';
 import type {GLTFLoaderOptions} from '../../gltf-loader';
+
 import {getAccessorArrayTypeAndLength} from '../gltf-utils/gltf-utils';
 import {BYTES, COMPONENTS} from '../gltf-utils/gltf-constants';
-import {
-  Accessor,
-  BufferView,
-  MaterialNormalTextureInfo,
-  MaterialOcclusionTextureInfo,
-  TextureInfo as GLTFTextureInfo
-} from '../types/gltf-json-schema';
-import GLTFScenegraph from '../api/gltf-scenegraph';
+import {} from '../types/gltf-json-schema';
+import {GLTFScenegraph} from '../api/gltf-scenegraph';
 
 /** Extension name */
 const EXT_MESHOPT_TRANSFORM = 'KHR_texture_transform';
@@ -38,8 +41,8 @@ type TextureInfo = {
 };
 /** Intersection of all GLTF textures */
 type CompoundGLTFTextureInfo = GLTFTextureInfo &
-  MaterialNormalTextureInfo &
-  MaterialOcclusionTextureInfo;
+  GLTFMaterialNormalTextureInfo &
+  GLTFMaterialOcclusionTextureInfo;
 /** Parameters for TEXCOORD transformation */
 type TransformParameters = {
   /** Original texCoord value https://www.khronos.org/registry/glTF/specs/2.0/glTF-2.0.html#_textureinfo_texcoord */
@@ -57,8 +60,8 @@ type TransformParameters = {
  */
 export async function decode(gltfData: GLTFWithBuffers, options: GLTFLoaderOptions) {
   const gltfScenegraph = new GLTFScenegraph(gltfData);
-  const extension = gltfScenegraph.getExtension(EXT_MESHOPT_TRANSFORM);
-  if (!extension) {
+  const hasExtension = gltfScenegraph.hasExtension(EXT_MESHOPT_TRANSFORM);
+  if (!hasExtension) {
     return;
   }
   const materials = gltfData.json.materials || [];
@@ -220,8 +223,8 @@ function transformPrimitive(
  * @param newTexcoordArray typed array with data after transformation
  */
 function updateGltf(
-  accessor: Accessor,
-  bufferView: BufferView,
+  accessor: GLTFAccessor,
+  bufferView: GLTFBufferView,
   buffers: {arrayBuffer: ArrayBuffer; byteOffset: number; byteLength: number}[],
   newTexCoordArray: Float32Array
 ): void {
@@ -248,7 +251,7 @@ function updateGltf(
  */
 function createAttribute(
   newTexCoord: number,
-  originalAccessor: Accessor,
+  originalAccessor: GLTFAccessor,
   primitive: GLTFMeshPrimitive,
   gltfData: GLTFWithBuffers,
   newTexCoordArray: Float32Array
@@ -288,8 +291,8 @@ function createAttribute(
  */
 function makeTransformationMatrix(extensionData: TextureInfo): Matrix3 {
   const {offset = [0, 0], rotation = 0, scale = [1, 1]} = extensionData;
-  const translationMatirx = new Matrix3().set(1, 0, 0, 0, 1, 0, offset[0], offset[1], 1);
-  const rotationMatirx = scratchRotationMatrix.set(
+  const translationMatrix = new Matrix3().set(1, 0, 0, 0, 1, 0, offset[0], offset[1], 1);
+  const rotationMatrix = scratchRotationMatrix.set(
     Math.cos(rotation),
     Math.sin(rotation),
     0,
@@ -301,5 +304,5 @@ function makeTransformationMatrix(extensionData: TextureInfo): Matrix3 {
     1
   );
   const scaleMatrix = scratchScaleMatrix.set(scale[0], 0, 0, 0, scale[1], 0, 0, 0, 1);
-  return translationMatirx.multiplyRight(rotationMatirx).multiplyRight(scaleMatrix);
+  return translationMatrix.multiplyRight(rotationMatrix).multiplyRight(scaleMatrix);
 }

package/src/lib/extensions/deprecated/EXT_feature_metadata.ts

@@ -1,44 +1,41 @@
 /* eslint-disable camelcase */
-import type {GLTF} from '../../types/gltf-types';
-
-import GLTFScenegraph from '../../api/gltf-scenegraph';
+import type {GLTF} from '../../types/gltf-json-schema';
+import {GLTFScenegraph} from '../../api/gltf-scenegraph';
+import {getImageData} from '@loaders.gl/images';
 import {
   ClassProperty,
   EXT_feature_metadata_class_object,
   EXT_feature_metadata_feature_table,
   FeatureTableProperty,
-  GLTF_EXT_feature_metadata
+  GLTF_EXT_feature_metadata,
+  EXT_feature_metadata_feature_texture,
+  FeatureTextureProperty,
+  GLTFMeshPrimitive
 } from '../../types/gltf-json-schema';
+import {getComponentTypeFromArray} from '../../gltf-utils/gltf-utils';
+import {GLTFLoaderOptions} from '../../../gltf-loader';
 
 /** Extension name */
 const EXT_FEATURE_METADATA = 'EXT_feature_metadata';
 
 export const name = EXT_FEATURE_METADATA;
 
-export async function decode(gltfData: {json: GLTF}): Promise<void> {
+export async function decode(gltfData: {json: GLTF}, options: GLTFLoaderOptions): Promise<void> {
   const scenegraph = new GLTFScenegraph(gltfData);
-  decodeExtFeatureMetadata(scenegraph);
+  decodeExtFeatureMetadata(scenegraph, options);
 }
 
 /**
  * Decodes feature metadata from extension
  * @param scenegraph
  */
-function decodeExtFeatureMetadata(scenegraph: GLTFScenegraph): void {
+function decodeExtFeatureMetadata(scenegraph: GLTFScenegraph, options: GLTFLoaderOptions): void {
   const extension: GLTF_EXT_feature_metadata | null = scenegraph.getExtension(EXT_FEATURE_METADATA);
-  const schemaClasses = extension?.schema?.classes;
-  const featureTables = extension?.featureTables;
-  const featureTextures = extension?.featureTextures;
-
-  if (featureTextures) {
-    /*
-     * TODO add support for featureTextures
-     * Spec - https://github.com/CesiumGS/glTF/tree/3d-tiles-next/extensions/2.0/Vendor/EXT_feature_metadata#feature-textures
-     */
-    // eslint-disable-next-line no-console
-    console.warn('featureTextures is not yet supported in the "EXT_feature_metadata" extension.');
-  }
+  if (!extension) return;
+
+  const schemaClasses = extension.schema?.classes;
 
+  const {featureTables} = extension;
   if (schemaClasses && featureTables) {
     for (const schemaName in schemaClasses) {
       const schemaClass = schemaClasses[schemaName];
@@ -49,6 +46,18 @@ function decodeExtFeatureMetadata(scenegraph: GLTFScenegraph): void {
       }
     }
   }
+
+  const {featureTextures} = extension;
+  if (schemaClasses && featureTextures && options.gltf?.loadImages) {
+    for (const schemaName in schemaClasses) {
+      const schemaClass = schemaClasses[schemaName];
+      const featureTexture = findFeatureTextureByName(featureTextures, schemaName);
+
+      if (featureTexture) {
+        handleFeatureTextureProperties(scenegraph, featureTexture, schemaClass);
+      }
+    }
+  }
 }
 
 /**
@@ -79,6 +88,30 @@ function handleFeatureTableProperties(
   }
 }
 
+/**
+ * Navigate throw all properies in feature texture and gets properties data.
+ * Data will be stored in featureTexture.properties[propertyName].data
+ * @param scenegraph
+ * @param featureTexture
+ * @param schemaClass
+ */
+function handleFeatureTextureProperties(
+  scenegraph: GLTFScenegraph,
+  featureTexture: EXT_feature_metadata_feature_texture,
+  schemaClass: EXT_feature_metadata_class_object
+): void {
+  const attributeName = featureTexture.class;
+
+  for (const propertyName in schemaClass.properties) {
+    const featureTextureProperty = featureTexture?.properties?.[propertyName];
+
+    if (featureTextureProperty) {
+      const data = getPropertyDataFromTexture(scenegraph, featureTextureProperty, attributeName);
+      featureTextureProperty.data = data;
+    }
+  }
+}
+
 /**
  * Decode properties from binary sourse based on property type.
  * @param scenegraph
@@ -94,20 +127,213 @@ function getPropertyDataFromBinarySource(
 ): Uint8Array | string[] {
   const bufferView = featureTableProperty.bufferView;
   // TODO think maybe we shouldn't get data only in Uint8Array format.
-  let data: Uint8Array | string[] = scenegraph.getTypedArrayForBufferView(bufferView);
+  const dataArray: Uint8Array = scenegraph.getTypedArrayForBufferView(bufferView);
 
   switch (schemaProperty.type) {
     case 'STRING': {
       // stringOffsetBufferView should be available for string type.
       const stringOffsetBufferView = featureTableProperty.stringOffsetBufferView!;
       const offsetsData = scenegraph.getTypedArrayForBufferView(stringOffsetBufferView);
-      data = getStringAttributes(data, offsetsData, numberOfFeatures);
-      break;
+      return getStringAttributes(dataArray, offsetsData, numberOfFeatures);
     }
     default:
   }
 
-  return data;
+  return dataArray;
+}
+
+/**
+ * Get properties from texture associated with all mesh primitives.
+ * @param scenegraph
+ * @param featureTextureProperty
+ * @param attributeName
+ * @returns Feature texture data
+ */
+function getPropertyDataFromTexture(
+  scenegraph: GLTFScenegraph,
+  featureTextureProperty: FeatureTextureProperty,
+  attributeName: string
+): number[] {
+  const json = scenegraph.gltf.json;
+  if (!json.meshes) {
+    return [];
+  }
+  const featureTextureTable: number[] = [];
+  for (const mesh of json.meshes) {
+    for (const primitive of mesh.primitives) {
+      processPrimitiveTextures(
+        scenegraph,
+        attributeName,
+        featureTextureProperty,
+        featureTextureTable,
+        primitive
+      );
+    }
+  }
+  return featureTextureTable;
+}
+
+// eslint-disable-next-line max-statements
+/**
+ * Processes data encoded in the texture associated with the primitive. This data will be accessible through the attributes.
+ * @param scenegraph
+ * @param attributeName
+ * @param featureTextureProperty
+ * @param featureTextureTable
+ * @param primitive
+ */
+function processPrimitiveTextures(
+  scenegraph: GLTFScenegraph,
+  attributeName: string,
+  featureTextureProperty: FeatureTextureProperty,
+  featureTextureTable: number[],
+  primitive: GLTFMeshPrimitive
+): void {
+  /*
+    texture.index is an index for the "textures" array.
+    The texture object referenced by this index looks like this:
+    {
+    "sampler": 0,
+    "source": 0
+    }
+    "sampler" is an index for the "samplers" array
+    "source" is an index for the "images" array that contains data. These data are stored in rgba channels of the image.
+
+    texture.texCoord is a number-suffix (like 1) for an attribute like "TEXCOORD_1" in meshes.primitives
+    The value of "TEXCOORD_1" is an accessor that is used to get coordinates. These coordinates ared used to get data from the image.
+  */
+  const json = scenegraph.gltf.json;
+  const textureData: number[] = [];
+  const texCoordAccessorKey = `TEXCOORD_${featureTextureProperty.texture.texCoord}`;
+  const texCoordAccessorIndex = primitive.attributes[texCoordAccessorKey];
+  const texCoordBufferView = scenegraph.getBufferView(texCoordAccessorIndex);
+  const texCoordArray: Uint8Array = scenegraph.getTypedArrayForBufferView(texCoordBufferView);
+
+  const textureCoordinates: Float32Array = new Float32Array(
+    texCoordArray.buffer,
+    texCoordArray.byteOffset,
+    texCoordArray.length / 4
+  );
+  // textureCoordinates contains UV coordinates of the actual data stored in the texture
+  // accessor.count is a number of UV pairs (they are stored as VEC2)
+
+  const textureIndex = featureTextureProperty.texture.index;
+  const texture = json.textures?.[textureIndex];
+  const imageIndex = texture?.source;
+  if (typeof imageIndex !== 'undefined') {
+    const image = json.images?.[imageIndex];
+    const mimeType = image?.mimeType;
+    const parsedImage = scenegraph.gltf.images?.[imageIndex];
+    if (parsedImage) {
+      for (let index = 0; index < textureCoordinates.length; index += 2) {
+        const value = getImageValueByCoordinates(
+          parsedImage,
+          mimeType,
+          textureCoordinates,
+          index,
+          featureTextureProperty.channels
+        );
+        textureData.push(value);
+      }
+    }
+  }
+  /*
+    featureTextureTable will contain unique values, e.g.
+      textureData = [24, 35, 28, 24]
+      featureTextureTable = [24, 35, 28]
+    featureIndices will contain indices hat refer featureTextureTable, e.g.
+      featureIndices = [0, 1, 2, 0]
+  */
+  const featureIndices: number[] = [];
+  for (const texelData of textureData) {
+    let index = featureTextureTable.findIndex((item) => item === texelData);
+    if (index === -1) {
+      index = featureTextureTable.push(texelData) - 1;
+    }
+    featureIndices.push(index);
+  }
+  const typedArray = new Uint32Array(featureIndices);
+  const bufferIndex =
+    scenegraph.gltf.buffers.push({
+      arrayBuffer: typedArray.buffer,
+      byteOffset: 0,
+      byteLength: typedArray.byteLength
+    }) - 1;
+  const bufferViewIndex = scenegraph.addBufferView(typedArray, bufferIndex, 0);
+  const accessorIndex = scenegraph.addAccessor(bufferViewIndex, {
+    size: 1,
+    componentType: getComponentTypeFromArray(typedArray),
+    count: typedArray.length
+  });
+  primitive.attributes[attributeName] = accessorIndex;
+}
+
+function getImageValueByCoordinates(
+  parsedImage: any,
+  mimeType: string | undefined,
+  textureCoordinates: Float32Array,
+  index: number,
+  channels: string
+) {
+  const CHANNELS_MAP = {
+    r: {offset: 0, shift: 0},
+    g: {offset: 1, shift: 8},
+    b: {offset: 2, shift: 16},
+    a: {offset: 3, shift: 24}
+  };
+
+  const u = textureCoordinates[index];
+  const v = textureCoordinates[index + 1];
+
+  let components = 1;
+  if (mimeType && (mimeType.indexOf('image/jpeg') !== -1 || mimeType.indexOf('image/png') !== -1))
+    components = 4;
+  const offset = coordinatesToOffset(u, v, parsedImage, components);
+  let value = 0;
+  for (const c of channels) {
+    const map = CHANNELS_MAP[c];
+    const val = getVal(parsedImage, offset + map.offset);
+    value |= val << map.shift;
+  }
+  return value;
+}
+
+function getVal(parsedImage: any, offset: number): number {
+  const imageData = getImageData(parsedImage);
+  if (imageData.data.length <= offset) {
+    throw new Error(`${imageData.data.length} <= ${offset}`);
+  }
+  return imageData.data[offset];
+}
+
+function coordinatesToOffset(
+  u: number,
+  v: number,
+  parsedImage: any,
+  componentsCount: number = 1
+): number {
+  const w = parsedImage.width;
+  const iX = emod(u) * (w - 1);
+  const indX = Math.round(iX);
+
+  const h = parsedImage.height;
+  const iY = emod(v) * (h - 1);
+  const indY = Math.round(iY);
+  const components = parsedImage.components ? parsedImage.components : componentsCount;
+  // components is a number of channels in the image
+  const offset = (indY * w + indX) * components;
+  return offset;
+}
+
+// The following is taken from tile-converter\src\i3s-converter\helpers\batch-ids-extensions.ts
+/**
+ * Handle UVs if they are out of range [0,1].
+ * @param n
+ * @param m
+ */
+function emod(n: number): number {
+  const a = ((n % 1) + 1) % 1;
+  return a;
 }
 
 /**
@@ -130,6 +356,21 @@ function findFeatureTableByName(
   return null;
 }
 
+function findFeatureTextureByName(
+  featureTextures: {[key: string]: EXT_feature_metadata_feature_texture},
+  schemaClassName: string
+): EXT_feature_metadata_feature_texture | null {
+  for (const featureTexturesName in featureTextures) {
+    const featureTable = featureTextures[featureTexturesName];
+
+    if (featureTable.class === schemaClassName) {
+      return featureTable;
+    }
+  }
+
+  return null;
+}
+
 /**
  * Getting string attributes from binary data.
  * Spec - https://github.com/CesiumGS/3d-tiles/tree/main/specification/Metadata#strings

package/src/lib/extensions/deprecated/KHR_lights_punctual.ts

@@ -1,10 +1,10 @@
 // GLTF EXTENSION: KHR_lights_punctual
 // https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/KHR_lights_punctual
 
-import type {GLTF} from '../../types/gltf-types';
+import type {GLTF} from '../../types/gltf-json-schema';
 
 import {assert} from '../../utils/assert';
-import GLTFScenegraph from '../../api/gltf-scenegraph';
+import {GLTFScenegraph} from '../../api/gltf-scenegraph';
 
 const KHR_LIGHTS_PUNCTUAL = 'KHR_lights_punctual';
 

package/src/lib/extensions/deprecated/KHR_materials_unlit.ts

@@ -1,9 +1,9 @@
 // GLTF EXTENSION: KHR_materials_unlit
 // https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/KHR_materials_unlit
 
-import type {GLTF} from '../../types/gltf-types';
+import type {GLTF} from '../../types/gltf-json-schema';
 
-import GLTFScenegraph from '../../api/gltf-scenegraph';
+import {GLTFScenegraph} from '../../api/gltf-scenegraph';
 
 const KHR_MATERIALS_UNLIT = 'KHR_materials_unlit';
 

package/src/lib/extensions/deprecated/KHR_techniques_webgl.ts

@@ -1,9 +1,9 @@
 // GLTF EXTENSION: KHR_techniques_webgl
 // https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/KHR_techniques_webgl
 
-import type {GLTF} from '../../types/gltf-types';
+import type {GLTF} from '../../types/gltf-json-schema';
 
-import GLTFScenegraph from '../../api/gltf-scenegraph';
+import {GLTFScenegraph} from '../../api/gltf-scenegraph';
 
 const KHR_TECHNIQUES_WEBGL = 'KHR_techniques_webgl';
 

package/src/lib/gltf-utils/gltf-attribute-utils.ts

@@ -1,5 +1,5 @@
 // import type {TypedArray} from '../types/loader-utils';
-import type {GLTFAccessor} from '../types/gltf-types';
+import type {GLTFAccessor} from '../types/gltf-json-schema';
 // TODO - remove
 import {getAccessorTypeFromSize, getComponentTypeFromArray} from './gltf-utils';
 

package/src/lib/gltf-utils/gltf-utils.ts

@@ -1,4 +1,11 @@
 import {assert} from '../utils/assert';
+import type {GLTFPostprocessed} from '../types/gltf-postprocessed-schema';
+
+/**
+ * Memory needed to store texture and all mipmap levels 1 + 1/4 + 1/16 + 1/64 + ...
+ * Minimum 1.33, but due to GPU layout may be 1.5
+ */
+const MIPMAP_FACTOR = 1.33;
 
 const TYPES = ['SCALAR', 'VEC2', 'VEC3', 'VEC4'];
 
@@ -77,3 +84,27 @@ export function getAccessorArrayTypeAndLength(accessor, bufferView) {
   assert(byteLength >= 0 && byteLength <= bufferView.byteLength);
   return {ArrayType, length, byteLength};
 }
+
+/**
+ * Calculate the GPU memory used by a GLTF tile, for both buffer and texture memory
+ * @param gltf - the gltf content of a GLTF tile
+ * @returns - total memory usage in bytes
+ */
+export function getMemoryUsageGLTF(gltf: GLTFPostprocessed): number {
+  let {images, bufferViews} = gltf;
+  images = images || [];
+  bufferViews = bufferViews || [];
+  const imageBufferViews = images.map((i) => i.bufferView);
+  bufferViews = bufferViews.filter((view) => !imageBufferViews.includes(view as any));
+
+  const bufferMemory = bufferViews.reduce((acc, view) => acc + view.byteLength, 0);
+
+  // Assume each pixel of the texture is 4 channel with mimmaps (which add 33%)
+  // TODO correctly handle compressed textures
+  const pixelCount = images.reduce((acc, image) => {
+    // @ts-ignore
+    const {width, height} = (image as any).image;
+    return acc + width * height;
+  }, 0);
+  return bufferMemory + Math.ceil(4 * pixelCount * MIPMAP_FACTOR);
+}