@loaders.gl/tile-converter 4.0.0-alpha.4 → 4.0.0-alpha.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@loaders.gl/tile-converter",
-  "version": "4.0.0-alpha.4",
+  "version": "4.0.0-alpha.6",
   "description": "Converter",
   "license": "MIT",
   "publishConfig": {
@@ -15,9 +15,9 @@
     "3dTiles",
     "i3s"
   ],
-  "types": "src/index.ts",
-  "main": "dist/index.js",
-  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "main": "dist/es5/index.js",
+  "module": "dist/esm/index.js",
   "sideEffects": false,
   "bin": {
     "tile-converter": "./bin/converter.js",
@@ -30,35 +30,42 @@
     "README.md"
   ],
   "browser": {
-    "fs": false
+    "fs": false,
+    "path": false,
+    "process": false,
+    "archiver": false,
+    "join-images": false
   },
   "scripts": {
-    "pre-build": "npm run build-bundle",
-    "post-build": "npm run build-converter-bundle",
-    "build-bundle": "esbuild ./src/index.ts --bundle --outfile=dist/bundle.js --platform=node",
-    "build-converter-bundle": "webpack --display errors-only --config ./converter-webpack/bundle.js"
+    "pre-build": "npm run build-bundle && npm run build-converter-bundle && npm run build-i3s-attributes-worker && npm run build-3d-tiles-attributes-worker",
+    "build-bundle": "esbuild ./src/index.ts --bundle --outfile=dist/dist.min.js --platform=node  --external:join-images",
+    "build-converter-bundle": "esbuild src/converter-cli.ts --outfile=dist/converter.min.js --platform=node --target=esnext,node14 --external:join-images --minify --bundle --define:__VERSION__=\\\"$npm_package_version\\\"",
+    "build-i3s-attributes-worker": "esbuild src/workers/i3s-attributes-worker.ts --outfile=dist/i3s-attributes-worker.js --platform=node --target=esnext,node14 --external:join-images --minify --bundle --sourcemap --define:__VERSION__=\\\"$npm_package_version\\\"",
+    "build-3d-tiles-attributes-worker": "esbuild src/workers/3d-tiles-attributes-worker.ts --outfile=dist/3d-tiles-attributes-worker.js --platform=node --target=esnext,node14 --external:join-images --minify --bundle --sourcemap --define:__VERSION__=\\\"$npm_package_version\\\""
   },
   "dependencies": {
-    "@loaders.gl/3d-tiles": "4.0.0-alpha.4",
-    "@loaders.gl/crypto": "4.0.0-alpha.4",
-    "@loaders.gl/draco": "4.0.0-alpha.4",
-    "@loaders.gl/gltf": "4.0.0-alpha.4",
-    "@loaders.gl/i3s": "4.0.0-alpha.4",
-    "@loaders.gl/images": "4.0.0-alpha.4",
-    "@loaders.gl/loader-utils": "4.0.0-alpha.4",
-    "@loaders.gl/polyfills": "4.0.0-alpha.4",
-    "@loaders.gl/tiles": "4.0.0-alpha.4",
-    "@loaders.gl/worker-utils": "4.0.0-alpha.4",
-    "@loaders.gl/zip": "4.0.0-alpha.4",
-    "@luma.gl/engine": "^8.5.4",
+    "@loaders.gl/3d-tiles": "4.0.0-alpha.6",
+    "@loaders.gl/crypto": "4.0.0-alpha.6",
+    "@loaders.gl/draco": "4.0.0-alpha.6",
+    "@loaders.gl/gltf": "4.0.0-alpha.6",
+    "@loaders.gl/i3s": "4.0.0-alpha.6",
+    "@loaders.gl/images": "4.0.0-alpha.6",
+    "@loaders.gl/loader-utils": "4.0.0-alpha.6",
+    "@loaders.gl/polyfills": "4.0.0-alpha.6",
+    "@loaders.gl/schema": "4.0.0-alpha.6",
+    "@loaders.gl/textures": "4.0.0-alpha.6",
+    "@loaders.gl/tiles": "4.0.0-alpha.6",
+    "@loaders.gl/worker-utils": "4.0.0-alpha.6",
+    "@loaders.gl/zip": "4.0.0-alpha.6",
     "@math.gl/core": "^3.5.1",
     "@math.gl/culling": "^3.5.1",
+    "@math.gl/geoid": "^3.5.1",
     "@math.gl/geospatial": "^3.5.1",
     "archiver": "^5.0.0",
     "cors": "^2.8.5",
     "crypt": "^0.0.2",
     "debug": "~2.6.9",
-    "express": "~4.16.1",
+    "express": "~4.17.3",
     "json-map-transform": "^1.2.6",
     "jszip": "^3.5.0",
     "md5": "^2.3.0",
@@ -66,7 +73,11 @@
     "uuid": "^8.1.0"
   },
   "peerDependencies": {
-    "@loaders.gl/core": "^3.0.0"
+    "@loaders.gl/core": "4.0.0-alpha.5"
   },
-  "gitHead": "53026061b3c8871f7e96d3a5826125cc6613bddc"
+  "quarantinedDependencies": {
+    "join-images": "^1.1.3",
+    "sharp": "^0.31.3"
+  },
+  "gitHead": "acc1985050dfaa0f1f0c066f8da5bce7454a046c"
 }

package/src/3d-tiles-attributes-worker.ts

@@ -0,0 +1,43 @@
+import type {WorkerObject} from '@loaders.gl/worker-utils';
+import type {FeatureAttribute} from '@loaders.gl/i3s';
+
+import {processOnWorker} from '@loaders.gl/worker-utils';
+
+// __VERSION__ is injected by babel-plugin-version-inline
+// @ts-ignore TS2304: Cannot find name '__VERSION__'.
+const VERSION = typeof __VERSION__ !== 'undefined' ? __VERSION__ : 'latest';
+
+export type Tile3DAttributesWorkerOptions = {
+  featureAttributes: FeatureAttribute | null;
+  source: string;
+};
+
+export type I3SAttributesData = {
+  tileContent: any;
+  textureFormat: string;
+};
+
+/**
+ * I3S Attributes Worker to handle B3DM object
+ */
+export const Tile3dAttributesWorker = {
+  id: '3d-tiles-attributes',
+  name: '3DTiles Attributes Worker',
+  module: 'tile-converter',
+  version: VERSION,
+  options: {
+    featureAttributes: null
+  }
+};
+
+/**
+ * Performs I3S attributes transformation
+ */
+export function transform3DTilesAttributesOnWorker(
+  i3sAttributesData: I3SAttributesData,
+  options: Tile3DAttributesWorkerOptions
+): Promise<ArrayBuffer> {
+  return processOnWorker(Tile3dAttributesWorker, i3sAttributesData, options);
+}
+
+export const _typecheckI3SAttributesWorker: WorkerObject = Tile3dAttributesWorker;

package/src/3d-tiles-converter/3d-tiles-converter.ts

@@ -4,9 +4,10 @@ import type {Node3D} from '@loaders.gl/3d-tiles';
 import {join} from 'path';
 import process from 'process';
 import transform from 'json-map-transform';
-import {load} from '@loaders.gl/core';
+import {fetchFile, getLoaderOptions, load, isBrowser} from '@loaders.gl/core';
 import {I3SLoader, I3SAttributeLoader, COORDINATE_SYSTEM} from '@loaders.gl/i3s';
 import {Tileset3D, Tile3D} from '@loaders.gl/tiles';
+import {Geoid} from '@math.gl/geoid';
 
 import {PGMLoader} from '../pgm-loader';
 import {i3sObbTo3dTilesObb} from './helpers/i3s-obb-to-3d-tiles-obb';
@@ -14,9 +15,14 @@ import {convertScreenThresholdToGeometricError} from '../lib/utils/lod-conversio
 import {writeFile, removeDir} from '../lib/utils/file-utils';
 import {calculateFilesSize, timeConverter} from '../lib/utils/statistic-utills';
 import {TILESET as tilesetTemplate} from './json-templates/tileset';
-import B3dmConverter from './helpers/b3dm-converter';
 import {createObbFromMbs} from '../i3s-converter/helpers/coordinate-converter';
-import {GeoidHeightModel} from '../lib/geoid-height-model';
+import {
+  I3SAttributesData,
+  Tile3dAttributesWorker,
+  transform3DTilesAttributesOnWorker
+} from '../3d-tiles-attributes-worker';
+import {getWorkerURL, WorkerFarm} from '@loaders.gl/worker-utils';
+import {BROWSER_ERROR_MESSAGE} from '../constants';
 
 const I3S = 'I3S';
 
@@ -28,9 +34,10 @@ export default class Tiles3DConverter {
   tilesetPath: string;
   vertexCounter: number;
   conversionStartTime: [number, number];
-  geoidHeightModel: GeoidHeightModel;
-  sourceTileset: Tileset3D;
-  attributeStorageInfo: AttributeStorageInfo;
+  geoidHeightModel: Geoid | null;
+  sourceTileset: Tileset3D | null;
+  attributeStorageInfo: AttributeStorageInfo | null;
+  workerSource: {[key: string]: string} = {};
 
   constructor() {
     this.options = {};
@@ -40,6 +47,7 @@ export default class Tiles3DConverter {
     this.geoidHeightModel = null;
     this.sourceTileset = null;
     this.attributeStorageInfo = null;
+    this.workerSource = {};
   }
 
   /**
@@ -51,13 +59,17 @@ export default class Tiles3DConverter {
    * @param options.egmFilePath location of *.pgm file to convert heights from ellipsoidal to gravity-related format
    * @param options.maxDepth The max tree depth of conversion
    */
-  private async convert(options: {
+  public async convert(options: {
     inputUrl: string;
     outputPath: string;
     tilesetName: string;
-    maxDepth: number;
+    maxDepth?: number;
     egmFilePath: string;
   }): Promise<any> {
+    if (isBrowser) {
+      console.log(BROWSER_ERROR_MESSAGE);
+      return BROWSER_ERROR_MESSAGE;
+    }
     const {inputUrl, outputPath, tilesetName, maxDepth, egmFilePath} = options;
     this.conversionStartTime = process.hrtime();
     this.options = {maxDepth};
@@ -66,13 +78,25 @@ export default class Tiles3DConverter {
     this.geoidHeightModel = await load(egmFilePath, PGMLoader);
     console.log('Loading egm file completed!'); // eslint-disable-line
 
+    await this.loadWorkers();
+
     const sourceTilesetJson = await load(inputUrl, I3SLoader, {});
+
     this.sourceTileset = new Tileset3D(sourceTilesetJson, {
-      loadOptions: {i3s: {coordinateSystem: COORDINATE_SYSTEM.LNGLAT_OFFSETS}}
+      loadOptions: {
+        _nodeWorkers: true,
+        reuseWorkers: true,
+        'i3s-content-nodejs': {
+          workerUrl: './modules/i3s/dist/i3s-content-nodejs-worker.js'
+        },
+        i3s: {coordinateSystem: COORDINATE_SYSTEM.LNGLAT_OFFSETS, decodeTextures: false}
+      }
     });
 
-    if (!this.sourceTileset.root.header.obb) {
-      this.sourceTileset.root.header.obb = createObbFromMbs(this.sourceTileset.root.header.mbs);
+    await this.sourceTileset.tilesetInitializationPromise;
+    const rootNode = this.sourceTileset.root!;
+    if (!rootNode.header.obb) {
+      rootNode.header.obb = createObbFromMbs(rootNode.header.mbs);
     }
 
     this.tilesetPath = join(`${outputPath}`, `${tilesetName}`);
@@ -86,18 +110,83 @@ export default class Tiles3DConverter {
 
     const rootTile: Node3D = {
       boundingVolume: {
-        box: i3sObbTo3dTilesObb(this.sourceTileset.root.header.obb, this.geoidHeightModel)
+        box: i3sObbTo3dTilesObb(rootNode.header.obb, this.geoidHeightModel)
       },
-      geometricError: convertScreenThresholdToGeometricError(this.sourceTileset.root),
+      geometricError: convertScreenThresholdToGeometricError(rootNode),
       children: []
     };
 
-    await this._addChildren(this.sourceTileset.root, rootTile, 1);
+    await this._addChildren(rootNode, rootTile, 1);
 
-    const tileset = transform({root: rootTile}, tilesetTemplate);
+    const tileset = transform({root: rootTile}, tilesetTemplate());
     await writeFile(this.tilesetPath, JSON.stringify(tileset), 'tileset.json');
 
     this._finishConversion({slpk: false, outputPath, tilesetName});
+
+    // Clean up worker pools
+    const workerFarm = WorkerFarm.getWorkerFarm({});
+    workerFarm.destroy();
+  }
+
+  /**
+   * Convert particular I3S Node
+   * @param parentSourceNode the parent node tile object (@loaders.gl/tiles/Tile3D)
+   * @param parentNode object in resulting tileset
+   * @param level a current level of a tree depth
+   * @param childNodeInfo child node to convert
+   */
+  private async convertChildNode(
+    parentSourceNode: Tile3D,
+    parentNode: Node3D,
+    level: number,
+    childNodeInfo: NodeReference
+  ): Promise<void> {
+    const sourceChild = await this._loadChildNode(parentSourceNode, childNodeInfo);
+    parentSourceNode.children.push(sourceChild);
+    if (sourceChild.contentUrl) {
+      await this.sourceTileset!._loadTile(sourceChild);
+      this.vertexCounter += sourceChild.content.vertexCount;
+
+      let featureAttributes: FeatureAttribute | null = null;
+      if (this.attributeStorageInfo) {
+        featureAttributes = await this._loadChildAttributes(sourceChild, this.attributeStorageInfo);
+      }
+
+      if (!sourceChild.header.obb) {
+        sourceChild.header.obb = createObbFromMbs(sourceChild.header.mbs);
+      }
+
+      const boundingVolume = {
+        box: i3sObbTo3dTilesObb(sourceChild.header.obb, this.geoidHeightModel)
+      };
+      const child: Node3D = {
+        boundingVolume,
+        geometricError: convertScreenThresholdToGeometricError(sourceChild),
+        children: []
+      };
+
+      const i3sAttributesData: I3SAttributesData = {
+        tileContent: sourceChild.content,
+        textureFormat: sourceChild?.header?.textureFormat
+      };
+
+      const b3dm = await transform3DTilesAttributesOnWorker(i3sAttributesData, {
+        source: this.workerSource.tile3dWorkerSource,
+        featureAttributes
+      });
+
+      child.content = {
+        uri: `${sourceChild.id}.b3dm`,
+        boundingVolume
+      };
+      await writeFile(this.tilesetPath, new Uint8Array(b3dm), `${sourceChild.id}.b3dm`);
+      parentNode.children.push(child);
+
+      sourceChild.unloadContent();
+      await this._addChildren(sourceChild, child, level + 1);
+    } else {
+      await this._addChildren(sourceChild, parentNode, level + 1);
+    }
   }
 
   /**
@@ -114,45 +203,11 @@ export default class Tiles3DConverter {
     if (this.options.maxDepth && level > this.options.maxDepth) {
       return;
     }
+    const promises: Promise<void>[] = [];
     for (const childNodeInfo of parentSourceNode.header.children || []) {
-      const sourceChild = await this._loadChildNode(parentSourceNode, childNodeInfo);
-      parentSourceNode.children.push(sourceChild);
-      if (sourceChild.contentUrl) {
-        await this.sourceTileset._loadTile(sourceChild);
-        this.vertexCounter += sourceChild.content.vertexCount;
-
-        let attributes = null;
-        if (this.attributeStorageInfo) {
-          attributes = await this._loadChildAttributes(sourceChild, this.attributeStorageInfo);
-        }
-
-        if (!sourceChild.header.obb) {
-          sourceChild.header.obb = createObbFromMbs(sourceChild.header.mbs);
-        }
-
-        const boundingVolume = {
-          box: i3sObbTo3dTilesObb(sourceChild.header.obb, this.geoidHeightModel)
-        };
-        const child: Node3D = {
-          boundingVolume,
-          geometricError: convertScreenThresholdToGeometricError(sourceChild),
-          children: []
-        };
-
-        const b3dm = await new B3dmConverter().convert(sourceChild, attributes);
-        child.content = {
-          uri: `${sourceChild.id}.b3dm`,
-          boundingVolume
-        };
-        await writeFile(this.tilesetPath, new Uint8Array(b3dm), `${sourceChild.id}.b3dm`);
-        parentNode.children.push(child);
-
-        sourceChild.unloadContent();
-        await this._addChildren(sourceChild, child, level + 1);
-      } else {
-        await this._addChildren(sourceChild, parentNode, level + 1);
-      }
+      promises.push(this.convertChildNode(parentSourceNode, parentNode, level, childNodeInfo));
     }
+    await Promise.all(promises);
   }
 
   /**
@@ -163,18 +218,18 @@ export default class Tiles3DConverter {
    */
   private async _loadChildNode(parentNode: Tile3D, childNodeInfo: NodeReference): Promise<Tile3D> {
     let header;
-    if (this.sourceTileset.tileset.nodePages) {
+    if (this.sourceTileset!.tileset.nodePages) {
       console.log(`Node conversion: ${childNodeInfo.id}`); // eslint-disable-line no-console,no-undef
-      header = await this.sourceTileset.tileset.nodePagesTile.formTileFromNodePages(
+      header = await this.sourceTileset!.tileset.nodePagesTile.formTileFromNodePages(
         childNodeInfo.id
       );
     } else {
-      const {loader} = this.sourceTileset;
-      const nodeUrl = this._relativeUrlToFullUrl(parentNode.url, childNodeInfo.href);
+      const {loader} = this.sourceTileset!;
+      const nodeUrl = this._relativeUrlToFullUrl(parentNode.url, childNodeInfo.href!);
       // load metadata
       const options = {
         i3s: {
-          ...this.sourceTileset.loadOptions,
+          ...this.sourceTileset!.loadOptions,
           isTileHeader: true,
           loadContent: false
         }
@@ -183,7 +238,7 @@ export default class Tiles3DConverter {
       console.log(`Node conversion: ${nodeUrl}`); // eslint-disable-line no-console,no-undef
       header = await load(nodeUrl, loader, options);
     }
-    return new Tile3D(this.sourceTileset, header, parentNode);
+    return new Tile3D(this.sourceTileset!, header, parentNode);
   }
 
   /**
@@ -218,7 +273,7 @@ export default class Tiles3DConverter {
     sourceChild: Tile3D,
     attributeStorageInfo: AttributeStorageInfo
   ): Promise<FeatureAttribute> {
-    const promises = [];
+    const promises: any[] = [];
     const {attributeUrls} = sourceChild.header;
 
     for (let index = 0; index < attributeUrls.length; index++) {
@@ -286,4 +341,14 @@ export default class Tiles3DConverter {
     console.log(`File(s) size: `, filesSize, ' bytes'); // eslint-disable-line
     console.log(`------------------------------------------------`); // eslint-disable-line
   }
+
+  private async loadWorkers(): Promise<void> {
+    console.log(`Loading workers source...`); // eslint-disable-line no-undef, no-console
+    const tile3dAttributesWorkerUrl = getWorkerURL(Tile3dAttributesWorker, {...getLoaderOptions()});
+    const sourceResponse = await fetchFile(tile3dAttributesWorkerUrl);
+    const source = await sourceResponse.text();
+
+    this.workerSource.tile3dWorkerSource = source;
+    console.log(`Loading workers source completed!`); // eslint-disable-line no-undef, no-console
+  }
 }

package/src/3d-tiles-converter/helpers/{b3dm-converter.js → b3dm-converter.ts}

@@ -1,7 +1,8 @@
-import {encode, encodeSync} from '@loaders.gl/core';
+import type {I3SAttributesData} from '../../3d-tiles-attributes-worker';
+
+import {encodeSync} from '@loaders.gl/core';
 import {GLTFScenegraph, GLTFWriter} from '@loaders.gl/gltf';
 import {Tile3DWriter} from '@loaders.gl/3d-tiles';
-import {ImageWriter} from '@loaders.gl/images';
 import {Matrix4, Vector3} from '@math.gl/core';
 import {Ellipsoid} from '@math.gl/geospatial';
 import {convertTextureAtlas} from './texture-atlas';
@@ -9,33 +10,57 @@ import {convertTextureAtlas} from './texture-atlas';
 const Z_UP_TO_Y_UP_MATRIX = new Matrix4([1, 0, 0, 0, 0, 0, -1, 0, 0, 1, 0, 0, 0, 0, 0, 1]);
 const scratchVector = new Vector3();
 
+/**
+ * Converts content of an I3S node to *.b3dm's file content
+ */
 export default class B3dmConverter {
-  async convert(i3sTile, attributes = null) {
-    this.i3sTile = i3sTile;
-    const gltf = await this.buildGltf(i3sTile);
+  // @ts-expect-error
+  rtcCenter: Float32Array;
+  i3sTile: any;
+
+  /**
+   * The starter of content conversion
+   * @param i3sTile - Tile3D instance for I3S node
+   * @returns - encoded content
+   */
+  async convert(
+    i3sAttributesData: I3SAttributesData,
+    featureAttributes: any = null
+  ): Promise<ArrayBuffer> {
+    const gltf = await this.buildGltf(i3sAttributesData, featureAttributes);
     const b3dm = encodeSync(
       {
         gltfEncoded: new Uint8Array(gltf),
         type: 'b3dm',
-        featuresLength: this._getFeaturesLength(attributes),
-        batchTable: attributes
+        featuresLength: this._getFeaturesLength(featureAttributes),
+        batchTable: featureAttributes
       },
       Tile3DWriter
     );
     return b3dm;
   }
 
-  async buildGltf(i3sTile) {
+  /**
+   * Build and encode gltf
+   * @param i3sTile - Tile3D instance for I3S node
+   * @returns - encoded glb content
+   */
+  async buildGltf(
+    i3sAttributesData: I3SAttributesData,
+    featureAttributes: any
+  ): Promise<ArrayBuffer> {
+    const {tileContent, textureFormat} = i3sAttributesData;
     const {
       material,
       attributes,
       indices: originalIndices,
       cartesianOrigin,
-      cartographicOrigin
-    } = i3sTile.content;
+      cartographicOrigin,
+      modelMatrix
+    } = tileContent;
     const gltfBuilder = new GLTFScenegraph();
 
-    const textureIndex = await this._addI3sTextureToGltf(i3sTile, gltfBuilder);
+    const textureIndex = await this._addI3sTextureToGltf(tileContent, textureFormat, gltfBuilder);
     const pbrMaterialInfo = this._convertI3sMaterialToGltfMaterial(material, textureIndex);
     const materialIndex = gltfBuilder.addMaterial(pbrMaterialInfo);
 
@@ -52,8 +77,10 @@ export default class B3dmConverter {
     attributes.positions.value = this._normalizePositions(
       positionsValue,
       cartesianOrigin,
-      cartographicOrigin
+      cartographicOrigin,
+      modelMatrix
     );
+    this._createBatchIds(tileContent, featureAttributes);
     if (attributes.normals && !this._checkNormals(attributes.normals.value)) {
       delete attributes.normals;
     }
@@ -62,7 +89,8 @@ export default class B3dmConverter {
     const meshIndex = gltfBuilder.addMesh({
       attributes,
       indices,
-      material: materialIndex
+      material: materialIndex,
+      mode: 4
     });
     const transformMatrix = this._generateTransformMatrix(cartesianOrigin);
     const nodeIndex = gltfBuilder.addNode({meshIndex, matrix: transformMatrix});
@@ -82,11 +110,8 @@ export default class B3dmConverter {
    * @param {GLTFScenegraph} gltfBuilder - gltfScenegraph instance to construct GLTF
    * @returns {Promise<number | null>} - GLTF texture index
    */
-  async _addI3sTextureToGltf(i3sTile, gltfBuilder) {
-    const {
-      content: {texture, material, attributes},
-      header: {textureFormat}
-    } = i3sTile;
+  async _addI3sTextureToGltf(tileContent, textureFormat, gltfBuilder) {
+    const {texture, material, attributes} = tileContent;
     let textureIndex = null;
     let selectedTexture = texture;
     if (!texture && material) {
@@ -97,8 +122,7 @@ export default class B3dmConverter {
     }
     if (selectedTexture) {
       const mimeType = this._deduceMimeTypeFromFormat(textureFormat);
-      const imageBuffer = await encode(selectedTexture, ImageWriter);
-      const imageIndex = gltfBuilder.addImage(imageBuffer, mimeType);
+      const imageIndex = gltfBuilder.addImage(selectedTexture, mimeType);
       textureIndex = gltfBuilder.addTexture({imageIndex});
       delete attributes.colors;
     }
@@ -109,14 +133,18 @@ export default class B3dmConverter {
    * Generate a positions array which is correct for 3DTiles/GLTF format
    * @param {Float64Array} positionsValue - the input geometry positions array
    * @param {number[]} cartesianOrigin - the tile center in the cartesian coordinate system
+   * @param {number[]} cartographicOrigin - the tile center in the cartographic coordinate system
+   * @param {number[]} modelMatrix - the model matrix of geometry
    * @returns {Float32Array} - the output geometry positions array
    */
-  _normalizePositions(positionsValue, cartesianOrigin, cartographicOrigin) {
+  _normalizePositions(positionsValue, cartesianOrigin, cartographicOrigin, modelMatrix) {
     const newPositionsValue = new Float32Array(positionsValue.length);
     for (let index = 0; index < positionsValue.length; index += 3) {
       const vertex = positionsValue.subarray(index, index + 3);
       const cartesianOriginVector = new Vector3(cartesianOrigin);
-      let vertexVector = new Vector3(Array.from(vertex)).add(cartographicOrigin);
+      let vertexVector = new Vector3(Array.from(vertex))
+        .transform(modelMatrix)
+        .add(cartographicOrigin);
       Ellipsoid.WGS84.cartographicToCartesian(vertexVector, scratchVector);
       vertexVector = scratchVector.subtract(cartesianOriginVector);
       newPositionsValue.set(vertexVector, index);
@@ -139,25 +167,28 @@ export default class B3dmConverter {
   }
 
   /**
-   * Generate batchId attribute from faceRanges.
-   * @param {Uint32Array} faceRanges - the source array
-   * @returns {Float32Array} batchId list.
+   * Create _BATCHID attribute
+   * @param {Object} i3sContent - the source object
+   * @returns {void}
    */
-  _generateBatchId(faceRanges) {
-    const batchIdArraySize = (faceRanges[faceRanges.length - 1] + 1) * 3;
-    const batchId = new Float32Array(batchIdArraySize);
-    let rangeIndex = 0;
-    let currentBatchId = 0;
-
-    for (let index = 0; index < faceRanges.length / 2; index++) {
-      const fromIndex = faceRanges[rangeIndex] * 3;
-      const untilPosition = (faceRanges[rangeIndex + 1] + 1) * 3;
+  _createBatchIds(i3sContent, featureAttributes) {
+    const {featureIds} = i3sContent;
+    const {OBJECTID: objectIds} = featureAttributes || {};
+    if (!featureIds || !objectIds) {
+      return;
+    }
 
-      batchId.fill(currentBatchId, fromIndex, untilPosition);
-      rangeIndex += 2;
-      currentBatchId += 1;
+    for (let i = 0; i < featureIds.length; i++) {
+      const featureId = featureIds[i];
+      const batchId = objectIds.indexOf(featureId);
+      featureIds[i] = batchId;
     }
-    return batchId;
+
+    i3sContent.attributes._BATCHID = {
+      size: 1,
+      byteOffset: 0,
+      value: featureIds
+    };
   }
 
   /**
@@ -187,6 +218,8 @@ export default class B3dmConverter {
         return 'image/jpeg';
       case 'png':
         return 'image/png';
+      case 'ktx2':
+        return 'image/ktx2';
       default:
         console.warn(`Unexpected texture format in I3S: ${format}`); // eslint-disable-line no-console, no-undef
         return 'image/jpeg';

package/src/3d-tiles-converter/helpers/{i3s-obb-to-3d-tiles-obb.js → i3s-obb-to-3d-tiles-obb.ts}

@@ -1,8 +1,23 @@
 import {Vector3} from '@math.gl/core';
 import {Ellipsoid} from '@math.gl/geospatial';
 import {OrientedBoundingBox} from '@math.gl/culling';
+// @ts-expect-error
+import {GeoidHeightModel} from '@loaders.gl/tile-converter/lib/geoid-height-model';
 
-export function i3sObbTo3dTilesObb(i3SObb, geoidHeightModel) {
+/**
+ * Convert quaternion-based OBB to half-axes-based OBB
+ * @param i3SObb quaternion based OBB
+ * @param geoidHeightModel the Earth Gravity Model instance
+ * @returns number[12] 3DTiles OBB https://github.com/CesiumGS/3d-tiles/tree/master/specification#box
+ */
+export function i3sObbTo3dTilesObb(
+  i3SObb: {
+    center: number[];
+    halfSize: number[];
+    quaternion: number[];
+  },
+  geoidHeightModel: GeoidHeightModel
+): number[] {
   const tiles3DCenter = [
     i3SObb.center[0],
     i3SObb.center[1],