Custom polygon material (#168)

* Bumb BabylonJS version to 7.24
Remove material plugins and add custom material for polygon meshes

* Replace number literals with named constants, remove commented code

package.json

@@ -51,14 +51,6 @@
     "typescript": "4.7.4",
     "vite-plugin-dts": "^3.3.1"
   },
-  "dependenciesMeta": {
-    "@babylonjs/core@5.42.0": {
-      "unplugged": true
-    },
-    "@babylonjs/materials@5.42.0": {
-      "unplugged": true
-    }
-  },
   "dependencies": {
     "node-sass": "^9.0.0",
     "svelte-preprocess": "^5.0.4"

packages/common/package.json

@@ -35,7 +35,7 @@
     "lint:fix": "yarn g:eslint './src/**/*.{ts,tsx}' --fix"
   },
   "dependencies": {
-    "@babylonjs/core": "7.0.0",
+    "@babylonjs/core": "^7.26.0",
     "@tiledb-inc/tiledb-cloud": "1.0.15-alpha.1"
   },
   "devDependencies": {

packages/core/package.json

@@ -39,20 +39,20 @@
     "lint:fix": "yarn g:eslint './src/**/*.{ts,tsx}' --fix"
   },
   "dependencies": {
-    "@babylonjs/core": "7.0.0",
-    "@babylonjs/gui": "7.0.0",
-    "@babylonjs/gui-editor": "7.0.0",
-    "@babylonjs/inspector": "7.0.0",
-    "@babylonjs/loaders": "7.0.0",
-    "@babylonjs/materials": "7.0.0",
-    "@babylonjs/serializers": "7.0.0",
+    "@babylonjs/core": "^7.26.0",
+    "@babylonjs/gui": "^7.26.0",
+    "@babylonjs/gui-editor": "^7.26.0",
+    "@babylonjs/inspector": "^7.26.0",
+    "@babylonjs/loaders": "^7.26.0",
+    "@babylonjs/materials": "^7.26.0",
+    "@babylonjs/serializers": "^7.26.0",
     "@tiledb-inc/tiledb-cloud": "1.0.15-alpha.1",
     "@tiledb-inc/viz-common": "workspace:packages/common",
     "@tiledb-inc/viz-components": "workspace:packages/components",
     "@tiledb-inc/wkx": "https://github.com/TileDB-Inc/wkx",
     "axios": "^0.21.1",
-    "babylonjs-gui": "7.0.0",
-    "babylonjs-materials": "7.0.0",
+    "babylonjs-gui": "^7.26.0",
+    "babylonjs-materials": "^7.26.0",
     "earcut": "2.2.4",
     "geometry-extrude": "0.2.1",
     "idb": "^7.0.2",

packages/core/src/base/base.ts

@@ -1,4 +1,10 @@
-import { Engine, Scene, SceneLoader, WebGPUEngine } from '@babylonjs/core';
+import {
+  AbstractEngine,
+  Engine,
+  Scene,
+  SceneLoader,
+  WebGPUEngine
+} from '@babylonjs/core';
 import '@babylonjs/loaders/glTF';
 import '@babylonjs/core/Debug/debugLayer';
 import '@babylonjs/inspector';
@@ -39,7 +45,7 @@ export class TileDBVisualization {
   width: string;
   height: string;
   canvas?: HTMLCanvasElement;
-  engine?: Engine;
+  engine?: AbstractEngine;
   wheelPrecision: number;
   moveSpeed: number;
   inspector?: boolean;

packages/core/src/point-cloud/pipelines/high-quality-splats.ts

@@ -25,8 +25,8 @@ export class SPSHighQualitySplats {
     const depthRenderTarget = new RenderTargetTexture(
       'LinearDepthRenderTarget',
       {
-        width: this.scene.getEngine()._gl.canvas.width,
-        height: this.scene.getEngine()._gl.canvas.height
+        width: this.scene.getEngine().getRenderWidth(),
+        height: this.scene.getEngine().getRenderHeight()
       },
       this.scene,
       {
@@ -41,8 +41,8 @@ export class SPSHighQualitySplats {
     const additiveColorRenderTarget = new RenderTargetTexture(
       'additiveColorRenderTarget',
       {
-        width: this.scene.getEngine()._gl.canvas.width,
-        height: this.scene.getEngine()._gl.canvas.height
+        width: this.scene.getEngine().getRenderWidth(),
+        height: this.scene.getEngine().getRenderHeight()
       },
       this.scene,
       {
@@ -63,7 +63,7 @@ export class SPSHighQualitySplats {
       throw new Error('Render target initialization failed');
     }
 
-    depthRenderTarget.renderTarget._shareDepth(
+    depthRenderTarget.renderTarget.shareDepth(
       additiveColorRenderTarget.renderTarget
     );
 

packages/core/src/point-cloud/utils/particle-shader.ts

@@ -1,6 +1,6 @@
 import {
+  AbstractEngine,
   Effect,
-  Engine,
   PostProcess,
   Scene,
   ShaderMaterial
@@ -155,7 +155,7 @@ class ParticleShaderMaterial {
     scene: Scene,
     model: ArrayModel,
     options: TileDBPointCloudOptions,
-    engine?: Engine
+    engine?: AbstractEngine
   ) {
     if (scene.activeCameras) {
       if (engine) {

packages/core/src/tile/constants.ts

@@ -0,0 +1,4 @@
+export const HIGHLIGHTED_STATE = 1;
+export const SELECTED_STATE = 2;
+export const COLOR_GROUPS = 32;
+export const MAX_CATEGORIES = 192;