Colored Points by Properties Fix (#2436)

* Fix for points not getting the gradient texture with the colors when filtering by properties

* Allowed Points to use displayStyle

packages/viewer-sandbox/src/main.ts

@@ -363,7 +363,6 @@ const getStream = () => {
     // 'https://speckle.xyz/streams/b4086833f8/commits/94df4c6d16?overlay=c5b9c260ea,e3dc287d61,eaedd7d0a5,7f126ce0dd,02fee34ce3,9bda31611f,110282c4db,533c311e29,bf6814d779,1ba52affcf,cc4e75125e,3fd628e4e3'
     // Nice towers
     // 'https://latest.speckle.dev/streams/f4efe4bd7f/objects/5083dffc2ce54ce64c1fc4fab48ca877'
-    // 'http://127.0.0.1:3000/streams/30b75f0dea/objects/db765ed44ae10176c0bf8ba60d1ce67d'
     //
     // 'https://speckle.xyz/streams/7b253e5c4c/commits/025fcbb9cf'
     // BIG railway
@@ -382,6 +381,9 @@ const getStream = () => {
     // 'https://app.speckle.systems/projects/7591c56179/models/0185a7c62e'
     // 'https://app.speckle.systems/projects/24c98619ac/models/38639656b8'
     // 'https://app.speckle.systems/projects/96c43c61a6/models/fd12973e73'
+    // 'https://latest.speckle.systems/projects/2099ac4b5f/models/5d6eb30c16'
+    // Points with display style
+    // 'https://latest.speckle.systems/projects/7117052f4e/models/95c27a604d@1fa0e17f84'
   )
 }
 

packages/viewer/src/modules/batching/Batcher.ts

@@ -331,7 +331,9 @@ export default class Batcher {
     } else if (geometryType === GeometryType.LINE) {
       matRef = renderViews[0].renderData.displayStyle
     } else if (geometryType === GeometryType.POINT) {
-      matRef = renderViews[0].renderData.renderMaterial
+      matRef =
+        renderViews[0].renderData.renderMaterial ||
+        renderViews[0].renderData.displayStyle
     } else if (geometryType === GeometryType.POINT_CLOUD) {
       matRef = renderViews[0].renderData.renderMaterial
     } else if (geometryType === GeometryType.TEXT) {

packages/viewer/src/modules/batching/PrimitiveBatch.ts

@@ -10,6 +10,7 @@ import {
 import { type DrawGroup } from './Batch'
 import Materials from '../materials/Materials'
 import SpeckleStandardColoredMaterial from '../materials/SpeckleStandardColoredMaterial'
+import SpecklePointColouredMaterial from '../materials/SpecklePointColouredMaterial'
 
 export abstract class Primitive<
   TGeometry extends BufferGeometry = BufferGeometry,
@@ -244,7 +245,10 @@ export abstract class PrimitiveBatch implements Batch {
          *  because otherwise three.js won't properly update our custom uniforms
          */
         if (range.materialOptions.rampTexture !== undefined) {
-          if (range.material instanceof SpeckleStandardColoredMaterial) {
+          if (
+            range.material instanceof SpeckleStandardColoredMaterial ||
+            range.material instanceof SpecklePointColouredMaterial
+          ) {
             range.material.setGradientTexture(range.materialOptions.rampTexture)
           }
         }

packages/viewer/src/modules/materials/Materials.ts

@@ -255,8 +255,8 @@ export default class Materials {
           renderView.geometryType === GeometryType.TEXT)
           ? Materials.renderMaterialToString(materialData)
           : Materials.isDisplayStyle(materialData) &&
-            renderView.geometryType !== GeometryType.MESH &&
-            renderView.geometryType !== GeometryType.POINT
+            // && renderView.geometryType !== GeometryType.POINT // Allow Points to use displayStyle
+            renderView.geometryType !== GeometryType.MESH
           ? Materials.displayStyleToString(materialData)
           : ''
       if ((materialData as MaterialOptions).stencilOutlines) {
@@ -438,7 +438,7 @@ export default class Materials {
         size: 2,
         sizeAttenuation: false
       },
-      ['USE_RTE']
+      ['USE_RTE', 'USE_GRADIENT_RAMP']
     )
     ;(this.pointCloudColouredMaterial as SpecklePointMaterial).toneMapped = false
     this.pointCloudGradientMaterial = new SpecklePointColouredMaterial(
@@ -448,7 +448,7 @@ export default class Materials {
         size: 2,
         sizeAttenuation: false
       },
-      ['USE_RTE']
+      ['USE_RTE', 'USE_GRADIENT_RAMP']
     )
     ;(
       this.pointCloudGradientMaterial as SpecklePointColouredMaterial