Merge 80af1cc into de3b920

examples/deck.gl/i3s/app.js

@@ -16,16 +16,11 @@ import {centerMap, cesiumRender, cesiumUnload} from './cesium';
 const TEST_DATA_URL =
   'https://tiles.arcgis.com/tiles/z2tnIkrLQ2BRzr6P/arcgis/rest/services/SanFrancisco_Bldgs/SceneServer/layers/0';
 //philadelphia_Bldgs_text
-//Textured&Untextured
-//'https://urldefense.proofpoint.com/v2/url?u=https-3A__tiles.arcgis.com_tiles_z2tnIkrLQ2BRzr6P_arcgis_rest_services_philadelphia-5FBldgs-5Ftext-5Funtex_SceneServer_layers_0&d=DwIGAg&c=r2dcLCtU9q6n0vrtnDw9vg&r=uUft2jfAcssCZvs7TNFSSg&m=_cRfm773wKwaQfY-gwJnmnFhdfAc2w6eiJ0365x2msY&s=JSwo9eTTG3Pxwevj25groHWmKSPS5IJAB6lzSIoo_ns&e= ';
-// Texturedonly
+//https://tiles.arcgis.com/tiles/z2tnIkrLQ2BRzr6P/arcgis/rest/services/philadelphia_Bldgs_text_untex/SceneServer/layers/0
 //New_York_Buildings
 // const TEST_DATA_URL =
 // 'https://tiles.arcgis.com/tiles/z2tnIkrLQ2BRzr6P/arcgis/rest/services/New_York_Buildings/SceneServer/layers/0';
 
-// const TEST_DATA_URL =
-//   'https://tiles.arcgis.com/tiles/z2tnIkrLQ2BRzr6P/arcgis/rest/services/philadelphia_Bldgs_text_tex_untex_sub/SceneServer/layers/0';
-
 // Set your mapbox token here
 const MAPBOX_TOKEN = process.env.MapboxAccessToken; // eslint-disable-line
 

examples/deck.gl/i3s/index.html

@@ -7,7 +7,7 @@
       rel="stylesheet"
     />
     <meta charset='UTF-8' />
-    <title>3D Tiles Example</title>
+    <title>I3S Example </title>
     <style>
       html, body {
         margin:0px;
@@ -35,4 +35,3 @@
   </script>
   </body>
 </html>
-

modules/i3s/src/lib/parsers/parse-i3s-node-geometry.js

@@ -1,58 +1,147 @@
 import GL from '@luma.gl/constants';
-import {Vector3, Matrix4} from '@math.gl/core';
+import {Vector3, Matrix4} from 'math.gl';
 import {Ellipsoid} from '@math.gl/geospatial';
 
 const TYPE_ARRAY_MAP = {
   UInt8: Uint8Array,
-  Float32: Float32Array
+  UInt32: Uint32Array,
+  Float32: Float32Array,
+  UInt64: Float64Array
 };
 
 const GL_TYPE_MAP = {
   UInt8: GL.UNSIGNED_BYTE,
-  Float32: GL.FLOAT
+  Float32: GL.FLOAT,
+  UInt32: GL.UNSIGNED_INT,
+  UInt64: GL.FLOAT64
+};
+
+const I3S_NAMED_VERTEX_ATTRIBUTES = {
+  position: 'position',
+  normal: 'normal',
+  uv0: 'uv0',
+  color: 'color',
+  region: 'region'
+};
+
+const I3S_NAMED_GEOMETREY_ATTRIBUTES = {
+  vertexAttributes: 'vertexAttributes',
+  featureAttributeOrder: 'featureAttributeOrder',
+  featureAttributes: 'featureAttributes'
+};
+
+const I3S_NAMED_HEADER_ATTRIBUTES = {
+  header: 'header',
+  vertexCount: 'vertexCount',
+  featureCount: 'featureCount'
+};
+
+const SIZEOF = {
+  UInt8: 1,
+  UInt32: 4,
+  Float32: 4,
+  UInt64: 8
 };
 
 const scratchVector = new Vector3([0, 0, 0]);
 
+function constructFeatureDataStruct(tile) {
+  // seed featureData from defaultGeometrySchema
+  const defaultGeometrySchema = tile._tileset.defaultGeometrySchema;
+  const featureData = defaultGeometrySchema;
+  // populate the vertex attributes value types and values per element
+  for (const geometryAttribute in I3S_NAMED_GEOMETREY_ATTRIBUTES) {
+    for (const namedAttribute in I3S_NAMED_VERTEX_ATTRIBUTES) {
+      // const geomAttribute = defaultGeometrySchema[geometryAttribute];
+      const attribute = defaultGeometrySchema[geometryAttribute][namedAttribute];
+      if (attribute) {
+        const {byteOffset = 0, count = 0, valueType, valuesPerElement} = attribute;
+
+        featureData[geometryAttribute][namedAttribute] = {
+          valueType,
+          valuesPerElement,
+          byteOffset,
+          count
+        };
+      }
+    }
+  }
+
+  return featureData;
+}
+
+function parseHeaders(content, buffer) {
+  let currentAttributeOffset = 0;
+  // First 8 bytes reserved for header (vertexCount and featurecount)
+  let vertexCount = 0;
+  let featureCount = 0;
+  const headers = content.featureData[I3S_NAMED_HEADER_ATTRIBUTES.header];
+  for (const header in headers) {
+    const {property, type} = headers[header];
+    const TypedArrayTypeHeader = TYPE_ARRAY_MAP[type];
+    if (property === I3S_NAMED_HEADER_ATTRIBUTES.vertexCount) {
+      vertexCount = new TypedArrayTypeHeader(buffer, 0, 4)[0];
+      currentAttributeOffset += SIZEOF[type];
+    }
+    if (property === I3S_NAMED_HEADER_ATTRIBUTES.featureCount) {
+      featureCount = new TypedArrayTypeHeader(buffer, 4, 4)[0];
+      currentAttributeOffset += SIZEOF[type];
+    }
+  }
+  return {
+    vertexCount,
+    featureCount,
+    currentAttributeOffset
+  };
+}
+
 /* eslint-disable max-statements */
 export function parseI3SNodeGeometry(arrayBuffer, tile = {}) {
   if (!tile._content) {
-    return tile;
+    return {};
   }
 
   const content = tile._content;
   const mbs = tile._mbs;
 
-  const {featureData} = content;
+  // construct featureData from defaultGeometrySchema;
+  content.featureData = constructFeatureDataStruct(tile);
   content.attributes = {};
 
-  const buffer = arrayBuffer;
-  const geometryData = featureData.geometryData[0];
-  const {
-    params: {vertexAttributes}
-  } = featureData.geometryData[0];
+  // First 8 bytes reserved for header (vertexCount and featurecount)
+  const {vertexCount, currentAttributeOffset} = parseHeaders(content, arrayBuffer);
 
-  let minHeight = Infinity;
+  // construct and populate vertexAttributes
+  const vertexAttributes = content.featureData.vertexAttributes;
   const enuMatrix = new Matrix4();
+  let minHeight = Infinity;
+  // vertices byteOffset start at 8 (first 8 bytes reserved for header (vertexCount and featurecount)
+  let byteOffset = currentAttributeOffset;
 
   for (const attribute in vertexAttributes) {
-    const {byteOffset, count, valueType, valuesPerElement} = vertexAttributes[attribute];
+    const {valueType, valuesPerElement} = vertexAttributes[attribute];
+    // update count and byteOffset count by calculating from defaultGeometrySchema + binnary content
+    const count = vertexCount;
     const TypedArrayType = TYPE_ARRAY_MAP[valueType];
 
-    let value = new TypedArrayType(buffer, byteOffset, count * valuesPerElement);
+    let value = new TypedArrayType(arrayBuffer, byteOffset, count * valuesPerElement);
 
     if (attribute === 'position') {
       minHeight = value
         .filter((coordinate, index) => (index + 1) % 3 === 0)
         .reduce((accumulator, currentValue) => Math.min(accumulator, currentValue), Infinity);
 
-      content.vertexCount = count / 3;
+      content.vertexCount = count;
       content.cartographicOrigin = new Vector3(mbs[0], mbs[1], -minHeight);
       content.cartesianOrigin = new Vector3();
       Ellipsoid.WGS84.cartographicToCartesian(content.cartographicOrigin, content.cartesianOrigin);
       Ellipsoid.WGS84.eastNorthUpToFixedFrame(content.cartesianOrigin, enuMatrix);
       // cartesian
       value = offsetsToCartesians(value, content.cartographicOrigin);
+
+      // TODO fix
+      // add back the minHeight to mbs for now
+      tile._mbs[2] = -minHeight;
     }
 
     content.attributes[attribute] = {
@@ -64,14 +153,21 @@ export function parseI3SNodeGeometry(arrayBuffer, tile = {}) {
     if (attribute === 'color') {
       content.attributes[attribute].normalized = true;
     }
+
+    if (attribute === 'region' || attribute === 'normal') {
+      // do nothing for now...
+    }
+
+    byteOffset = byteOffset + count * valuesPerElement * SIZEOF[valueType];
   }
 
-  const matrix = new Matrix4(geometryData.transformation).multiplyRight(enuMatrix);
+  const matrix = new Matrix4(1, 0, 0, 0, 1, 0, 0, 0, 1).multiplyRight(enuMatrix);
   content.matrix = matrix.invert();
 
   content.byteLength = arrayBuffer.byteLength;
   return tile;
 }
+
 /* eslint-enable max-statements */
 
 function offsetsToCartesians(vertices, cartographicOrigin) {

modules/i3s/src/lib/tileset/i3s-tile-header.js

@@ -264,14 +264,6 @@ export default class I3STileHeader {
     }
   }
 
-  async _loadFeatureData() {
-    const featureData = this._header.featureData[0];
-    const featureDataPath = `${this._basePath}/nodes/${this.id}/${featureData.href}`;
-    this.tileset._debug[this.id].featureLoad++;
-    const response = await fetch(featureDataPath);
-    return await response.json();
-  }
-
   async _loadGeometryBuffer() {
     const geometryData = this._header.geometryData[0];
     const geometryDataPath = `${this._basePath}/nodes/${this.id}/${geometryData.href}`;
@@ -280,15 +272,11 @@ export default class I3STileHeader {
   }
 
   async _loadData() {
-    if (!(this._content && this._content.featureData)) {
+    if (!this._content || !this._content.featureData) {
       this._content = this._content || {};
-      this._content.featureData = {};
 
-      const featureData = await this._loadFeatureData();
       const geometryBuffer = await this._loadGeometryBuffer();
 
-      this._content.featureData = featureData;
-
       if (this._header.textureData) {
         this._content.texture = `${this._basePath}/nodes/${this.id}/${
           this._header.textureData[0].href

modules/i3s/src/lib/tileset/i3s-tileset.js

@@ -4,7 +4,6 @@
 import {Matrix4, Vector3} from '@math.gl/core';
 import {Ellipsoid} from '@math.gl/geospatial';
 import {Stats} from '@probe.gl/stats';
-
 import {path} from '@loaders.gl/core';
 import {assert, RequestScheduler} from '@loaders.gl/loader-utils';
 import {
@@ -126,6 +125,8 @@ export default class I3STileset {
 
     this._ellipsoid = this.options.ellipsoid;
 
+    this._defaultGeometrySchema = [];
+
     this._initializeTileSet(json, this.options);
   }
 
@@ -200,6 +201,11 @@ export default class I3STileset {
     return tilePath;
   }
 
+  // Get the defaultGeometrySchema
+  get defaultGeometrySchema() {
+    return this._defaultGeometrySchema;
+  }
+
   _onTraverseEnd() {
     this.selectedTiles = Object.values(this._traverser.selectedTiles);
     this._requestedTiles = Object.values(this._traverser.requestedTiles);
@@ -271,6 +277,9 @@ export default class I3STileset {
 
     // Calculate cartographicCenter & zoom props to help apps center view on tileset
     this._calculateViewProps();
+
+    // Initialize default Geometry schema
+    this._initializeDefaultGeometrySchema(tilesetJson);
   }
 
   // Called during initialize Tileset to initialize the tileset's cartographic center (longitude, latitude) and zoom.
@@ -421,4 +430,9 @@ export default class I3STileset {
     this.stats.get(POINTS_COUNT, 'memory');
     this.stats.get(TILES_GPU_MEMORY, 'memory');
   }
+
+  _initializeDefaultGeometrySchema(tilesetJson) {
+    const defaultGeometrySchema = tilesetJson.store.defaultGeometrySchema;
+    this._defaultGeometrySchema = defaultGeometrySchema;
+  }
 }