@loaders.gl/i3s 3.3.0-alpha.2 → 3.3.0-alpha.4

package/dist/workers/i3s-content-nodejs-worker.d.ts

@@ -0,0 +1,2 @@
+import '@loaders.gl/polyfills';
+//# sourceMappingURL=i3s-content-nodejs-worker.d.ts.map

package/dist/workers/i3s-content-nodejs-worker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"i3s-content-nodejs-worker.d.ts","sourceRoot":"","sources":["../../src/workers/i3s-content-nodejs-worker.ts"],"names":[],"mappings":"AACA,OAAO,uBAAuB,CAAC"}

package/dist/workers/i3s-content-nodejs-worker.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const loader_utils_1 = require("@loaders.gl/loader-utils");
+require("@loaders.gl/polyfills");
+const i3s_content_loader_1 = require("../i3s-content-loader");
+(0, loader_utils_1.createLoaderWorker)(i3s_content_loader_1.I3SContentLoader);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@loaders.gl/i3s",
-  "version": "3.3.0-alpha.2",
+  "version": "3.3.0-alpha.4",
   "description": "i3s .",
   "license": "MIT",
   "publishConfig": {
@@ -27,17 +27,18 @@
     "README.md"
   ],
   "scripts": {
-    "pre-build": "npm run build-bundle && npm run build-worker",
+    "pre-build": "npm run build-bundle && npm run build-worker && npm run build-loader-worker-nodejs",
     "build-bundle": "esbuild src/bundle.ts --bundle --outfile=dist/dist.min.js",
-    "build-worker": "esbuild src/workers/i3s-content-worker.ts --bundle --outfile=dist/i3s-content-worker.js --define:__VERSION__=\\\"$npm_package_version\\\""
+    "build-worker": "esbuild src/workers/i3s-content-worker.ts --bundle --outfile=dist/i3s-content-worker.js --define:__VERSION__=\\\"$npm_package_version\\\"",
+    "build-loader-worker-nodejs": "esbuild src/workers/i3s-content-nodejs-worker.ts --outfile=dist/i3s-content-nodejs-worker.js --platform=node --target=esnext,node12 --minify --bundle --sourcemap --define:__VERSION__=\\\"$npm_package_version\\\""
   },
   "dependencies": {
-    "@loaders.gl/draco": "3.3.0-alpha.2",
-    "@loaders.gl/images": "3.3.0-alpha.2",
-    "@loaders.gl/loader-utils": "3.3.0-alpha.2",
-    "@loaders.gl/schema": "3.3.0-alpha.2",
-    "@loaders.gl/textures": "3.3.0-alpha.2",
-    "@loaders.gl/tiles": "3.3.0-alpha.2",
+    "@loaders.gl/draco": "3.3.0-alpha.4",
+    "@loaders.gl/images": "3.3.0-alpha.4",
+    "@loaders.gl/loader-utils": "3.3.0-alpha.4",
+    "@loaders.gl/schema": "3.3.0-alpha.4",
+    "@loaders.gl/textures": "3.3.0-alpha.4",
+    "@loaders.gl/tiles": "3.3.0-alpha.4",
     "@luma.gl/constants": "^8.5.4",
     "@math.gl/core": "^3.5.1",
     "@math.gl/culling": "^3.5.1",
@@ -47,5 +48,5 @@
   "peerDependencies": {
     "@loaders.gl/core": "^3.2.0"
   },
-  "gitHead": "628f1f0eed0f14b50ccff4c561023acf6e0657e6"
+  "gitHead": "d1c524fd3cb9296ecd1bf7d185765c4f6aaef6a1"
 }

package/src/i3s-attribute-loader.ts

@@ -87,7 +87,7 @@ function getAttributesData(tile) {
  * @param {Object} attribute
  * @returns {String}
  */
-function getAttributeValueType(attribute) {
+export function getAttributeValueType(attribute) {
   if (attribute.hasOwnProperty('objectIds')) {
     return 'Oid32';
   } else if (attribute.hasOwnProperty('attributeValues')) {

package/src/i3s-content-loader.ts

@@ -1,3 +1,4 @@
+import {isBrowser} from '@loaders.gl/worker-utils';
 import type {LoaderWithParser, LoaderContext} from '@loaders.gl/loader-utils';
 import type {I3SLoaderOptions} from './i3s-loader';
 import {parseI3STileContent} from './lib/parsers/parse-i3s-tile-content';
@@ -12,7 +13,7 @@ const VERSION = typeof __VERSION__ !== 'undefined' ? __VERSION__ : 'beta';
  */
 export const I3SContentLoader: LoaderWithParser = {
   name: 'I3S Content (Indexed Scene Layers)',
-  id: 'i3s-content',
+  id: isBrowser ? 'i3s-content' : 'i3s-content-nodejs',
   module: 'i3s',
   worker: true,
   version: VERSION,

package/src/i3s-loader.ts

@@ -41,7 +41,8 @@ export const I3SLoader: LoaderWithParser = {
       useDracoGeometry: true,
       useCompressedTextures: true,
       decodeTextures: true,
-      coordinateSystem: COORDINATE_SYSTEM.METER_OFFSETS
+      coordinateSystem: COORDINATE_SYSTEM.METER_OFFSETS,
+      colorsByAttribute: null
     }
   }
 };

package/src/index.ts

@@ -26,6 +26,8 @@ export type {
   I3SMaterialDefinition,
   TextureDefinitionInfo,
   MaterialDefinitionInfo,
-  FullExtent
+  FullExtent,
+  StatisticsInfo,
+  StatsInfo
 } from './types';
 export {COORDINATE_SYSTEM} from './lib/parsers/constants';

package/src/lib/parsers/parse-i3s-tile-content.ts

@@ -22,6 +22,8 @@ import {
 import {getUrlWithToken} from '../utils/url-utils';
 
 import {GL_TYPE_MAP, getConstructorForDataFormat, sizeOf, COORDINATE_SYSTEM} from './constants';
+import {I3SLoaderOptions} from '../../i3s-loader';
+import {customizeColors} from '../utils/customizeColors';
 
 const scratchVector = new Vector3([0, 0, 0]);
 
@@ -41,17 +43,6 @@ function getLoaderForTextureFormat(textureFormat?: 'jpg' | 'png' | 'ktx-etc2' |
 
 const I3S_ATTRIBUTE_TYPE = 'i3s-attribute-type';
 
-const defaultContent: I3STileContent = {
-  attributes: {},
-  indices: null,
-  featureIds: [],
-  vertexCount: 0,
-  modelMatrix: new Matrix4(),
-  coordinateSystem: 0,
-  byteLength: 0,
-  texture: null
-};
-
 export async function parseI3STileContent(
   arrayBuffer: ArrayBuffer,
   tileOptions: I3STileOptions,
@@ -59,7 +50,16 @@ export async function parseI3STileContent(
   options?: LoaderOptions,
   context?: LoaderContext
 ): Promise<I3STileContent> {
-  const content: I3STileContent = defaultContent;
+  const content: I3STileContent = {
+    attributes: {},
+    indices: null,
+    featureIds: [],
+    vertexCount: 0,
+    modelMatrix: new Matrix4(),
+    coordinateSystem: 0,
+    byteLength: 0,
+    texture: null
+  };
 
   if (tileOptions.textureUrl) {
     const url = getUrlWithToken(tileOptions.textureUrl, options?.i3s?.token);
@@ -112,7 +112,7 @@ async function parseI3SNodeGeometry(
   content: I3STileContent,
   tileOptions: I3STileOptions,
   tilesetOptions: I3STilesetOptions,
-  options?: LoaderOptions
+  options?: I3SLoaderOptions
 ): Promise<I3STileContent> {
   const contentByteLength = arrayBuffer.byteLength;
   let attributes: I3SMeshAttributes;
@@ -201,6 +201,14 @@ async function parseI3SNodeGeometry(
     content.coordinateSystem = COORDINATE_SYSTEM.LNGLAT_OFFSETS;
   }
 
+  attributes.color = await customizeColors(
+    attributes.color,
+    attributes.id,
+    tileOptions,
+    tilesetOptions,
+    options
+  );
+
   content.attributes = {
     positions: attributes.position,
     normals: attributes.normal,

package/src/lib/utils/customizeColors.ts

@@ -0,0 +1,129 @@
+import type {MeshAttribute} from '@loaders.gl/schema';
+import type {COLOR, I3STileOptions, I3STilesetOptions} from '../../types';
+
+import {load} from '@loaders.gl/core';
+import {getAttributeValueType, I3SAttributeLoader} from '../../i3s-attribute-loader';
+import {I3SLoaderOptions} from '../../i3s-loader';
+import {getUrlWithToken} from '../utils/url-utils';
+
+/**
+ * Modify vertex colors array to visualize 3D objects in a attribute driven way
+ * @param colors - vertex colors attribute
+ * @param featureIds - feature Ids attribute
+ * @param tileOptions - tile - related options
+ * @param tilesetOptions - tileset-related options
+ * @param options - loader options
+ * @returns midified colors attribute
+ */
+export async function customizeColors(
+  colors: MeshAttribute,
+  featureIds: MeshAttribute,
+  tileOptions: I3STileOptions,
+  tilesetOptions: I3STilesetOptions,
+  options?: I3SLoaderOptions
+): Promise<MeshAttribute> {
+  if (!options?.i3s?.colorsByAttribute) {
+    return colors;
+  }
+
+  const colorizeAttributeField = tilesetOptions.fields.find(
+    ({name}) => name === options?.i3s?.colorsByAttribute?.attributeName
+  );
+  if (
+    !colorizeAttributeField ||
+    !['esriFieldTypeDouble', 'esriFieldTypeInteger', 'esriFieldTypeSmallInteger'].includes(
+      colorizeAttributeField.type
+    )
+  ) {
+    return colors;
+  }
+
+  const colorizeAttributeData = await loadFeatureAttributeData(
+    colorizeAttributeField.name,
+    tileOptions,
+    tilesetOptions,
+    options
+  );
+  if (!colorizeAttributeData) {
+    return colors;
+  }
+
+  const objectIdField = tilesetOptions.fields.find(({type}) => type === 'esriFieldTypeOID');
+  if (!objectIdField) {
+    return colors;
+  }
+
+  const objectIdAttributeData = await loadFeatureAttributeData(
+    objectIdField.name,
+    tileOptions,
+    tilesetOptions,
+    options
+  );
+  if (!objectIdAttributeData) {
+    return colors;
+  }
+
+  const attributeValuesMap: {[key: number]: COLOR} = {};
+  for (let i = 0; i < objectIdAttributeData[objectIdField.name].length; i++) {
+    attributeValuesMap[objectIdAttributeData[objectIdField.name][i]] = calculateColorForAttribute(
+      colorizeAttributeData[colorizeAttributeField.name][i] as number,
+      options
+    );
+  }
+
+  for (let i = 0; i < featureIds.value.length; i++) {
+    const color = attributeValuesMap[featureIds.value[i]];
+    if (!color) {
+      continue; // eslint-disable-line no-continue
+    }
+    colors.value.set(color, i * 4);
+  }
+
+  return colors;
+}
+
+/**
+ * Calculate rgba color from the attribute value
+ * @param attributeValue - value of the attribute
+ * @param options - loader options
+ * @returns - color array for a specific attribute value
+ */
+function calculateColorForAttribute(attributeValue: number, options?: I3SLoaderOptions): COLOR {
+  if (!options?.i3s?.colorsByAttribute) {
+    return [255, 255, 255, 255];
+  }
+  const {minValue, maxValue, minColor, maxColor} = options.i3s.colorsByAttribute;
+  const rate = (attributeValue - minValue) / (maxValue - minValue);
+  const color: COLOR = [255, 255, 255, 255];
+  for (let i = 0; i < minColor.length; i++) {
+    color[i] = Math.round((maxColor[i] - minColor[i]) * rate + minColor[i]);
+  }
+  return color;
+}
+
+/**
+ * Load feature attribute data from the ArcGIS rest service
+ * @param attributeName - attribute name
+ * @param tileOptions - tile-related options
+ * @param tilesetOptions - tileset-related options
+ * @param options - loader options
+ * @returns - Array-like list of the attribute values
+ */
+async function loadFeatureAttributeData(
+  attributeName: string,
+  {attributeUrls}: I3STileOptions,
+  {attributeStorageInfo}: I3STilesetOptions,
+  options?: I3SLoaderOptions
+): Promise<{[key: string]: string[] | Uint32Array | Uint16Array | Float64Array} | null> {
+  const attributeIndex = attributeStorageInfo.findIndex(({name}) => attributeName === name);
+  if (attributeIndex === -1) {
+    return null;
+  }
+  const objectIdAttributeUrl = getUrlWithToken(attributeUrls[attributeIndex], options?.i3s?.token);
+  const attributeType = getAttributeValueType(attributeStorageInfo[attributeIndex]);
+  const objectIdAttributeData = await load(objectIdAttributeUrl, I3SAttributeLoader, {
+    attributeName,
+    attributeType
+  });
+  return objectIdAttributeData;
+}

package/src/types.ts

@@ -13,6 +13,9 @@ export enum DATA_TYPE {
   Float32 = 'Float32',
   Float64 = 'Float64'
 }
+
+export type COLOR = [number, number, number, number];
+
 /**
  * spec - https://github.com/Esri/i3s-spec/blob/master/docs/1.8/3DSceneLayer.cmn.md
  */
@@ -110,6 +113,13 @@ export type I3SParseOptions = {
    * Supported coordinate systems: METER_OFFSETS, LNGLAT_OFFSETS
    */
   coordinateSystem?: number;
+  colorsByAttribute?: {
+    attributeName: string;
+    minValue: number;
+    maxValue: number;
+    minColor: COLOR;
+    maxColor: COLOR;
+  };
 };
 
 export type I3STileOptions = {
@@ -118,11 +128,14 @@ export type I3STileOptions = {
   textureFormat?: I3STextureFormat;
   textureLoaderOptions?: any;
   materialDefinition?: I3SMaterialDefinition;
+  attributeUrls: string[];
   mbs: Mbs;
 };
 
 export type I3STilesetOptions = {
   store: Store;
+  attributeStorageInfo: AttributeStorageInfo[];
+  fields: Field[];
 };
 
 // TODO Replace "[key: string]: any" with actual defenition
@@ -157,7 +170,7 @@ export type BoundingVolumes = {
 export type Obb = {
   center: number[] | Vector3;
   halfSize: number[] | Vector3;
-  quaternion: Quaternion;
+  quaternion: number[] | Quaternion;
 };
 
 export type Mbs = [number, number, number, number];
@@ -1005,3 +1018,46 @@ type CameraPosition = {
   y: number;
   z: number;
 };
+
+/**
+ * Spec - https://github.com/Esri/i3s-spec/blob/master/docs/1.8/statsInfo.cmn.md
+ */
+export type StatsInfo = {
+  /** Represents the count of the value. */
+  totalValuesCount?: number;
+  /** Minimum attribute value for the entire layer. */
+  min?: number;
+  /** Maximum attribute value for the entire layer. */
+  max?: number;
+  /** Count for the entire layer. */
+  count?: number;
+  /** Sum of the attribute values over the entire layer. */
+  sum?: number;
+  /** Representing average or mean value. For example, sum/count. */
+  avg?: number;
+  /** Representing the standard deviation. */
+  stddev?: number;
+  /**	Representing variance. For example, stats.stddev *stats.stddev. */
+  variance?: number;
+  /** Represents the histogram. */
+  histogram?: Histogram;
+  /** An array of most frequently used values within the point cloud scene layer. */
+  mostFrequentValues?: ValueCount[];
+};
+
+/** Spec - https://github.com/Esri/i3s-spec/blob/master/docs/1.8/histogram.cmn.md */
+export type Histogram = {
+  /** Minimum attribute value for the entire layer. */
+  minimum: number;
+  /** Maximum attribute value for the entire layer. Maximum array size for stats.histo.counts is 256. */
+  maximum: number;
+  /** Count for the entire layer. */
+  counts: number;
+};
+
+export type ValueCount = {
+  /** Type of the attribute values after decompression, if applicable. Please note that string is not supported for point cloud scene layer attributes. */
+  value: number | string;
+  /** Count of the number of values. May exceed 32 bits. */
+  count: number;
+};

package/src/workers/i3s-content-nodejs-worker.ts

@@ -0,0 +1,5 @@
+import {createLoaderWorker} from '@loaders.gl/loader-utils';
+import '@loaders.gl/polyfills';
+import {I3SContentLoader} from '../i3s-content-loader';
+
+createLoaderWorker(I3SContentLoader);