Select similar rgb points

imports/editor/3d/SseEditor3d.jsx

@@ -399,6 +399,7 @@ export default class SseEditor3d extends React.Component {
         this.onMsg("selection-mode-add", () => this.selectionMode = "add");
         this.onMsg("selection-mode-toggle", () => this.selectionMode = "toggle");
         this.onMsg("selection-mode-remove", () => this.selectionMode = "remove");
+        this.onMsg("selection-mode-similar", () => this.selectionMode = "similar");
 
         this.onMsg("classSelection", (arg) => {
             this.activeClassIndex = arg.descriptor.classIndex;
@@ -878,6 +879,11 @@ export default class SseEditor3d extends React.Component {
                 message += " (x: " + round2(oc.x)
                     + "m, y: " + round2(oc.y)
                     + "m, z: " + round2(oc.z) + "m)";
+                    if (this.rgbArray.length > 0)
+                    {
+                        const color = this.rgbArray[this.highlightedIndex]
+                        message += "(RGB: " + color[0]+ "," + color[1] + "," + color[2] + ")"
+                    }
                 this.sendMsg("bottom-right-label", {message})
             }
         } else {
@@ -964,6 +970,9 @@ export default class SseEditor3d extends React.Component {
         } else if (this.selectionMode == "remove") {
             this.removeIndexFromSelection(idx);
         }
+        else if (this.rgbArray.length > 0 && this.selectionMode == "similar") {
+            this.addSimilar(idx);
+        }        
         else {
             if (this.selection.has(idx))
                 this.removeIndexFromSelection(idx);
@@ -972,6 +981,19 @@ export default class SseEditor3d extends React.Component {
             }
         }
     }
+    addSimilar(idx)
+    {
+        const color = this.rgbArray[idx]
+        this.rgbArray.forEach((pt, pos) => {
+            const current_color = this.rgbArray[pos]
+            if (color.length == current_color.length && color.every((value, index) => value == current_color[index]))
+            {
+                this.selection.add(pos);
+
+            }
+        })
+        this.invalidateColor();
+    }
 
     drawPolyLine(context, pts, color, xField = 0, yField = 1, close) {
         if (!pts || !pts.length) return;

imports/editor/3d/SseToolbar3d.jsx

@@ -3,15 +3,18 @@ import React from 'react';
 import SseToolbar from "../../common/SseToolbar";
 import SseBranding from "../../common/SseBranding";
 import {
-    CircleOutline, FileDownloadOutline, Gesture, Minus, Plus, PlusMinus, Redo, SquareOutline,
+    CircleOutline, FileDownloadOutline, Flare, Gesture, Minus, Plus, PlusMinus, Redo, SquareOutline,
     Undo
 } from 'mdi-material-ui';
 
 export default class SseToolbar3d extends SseToolbar {
 
     constructor() {
         super();
-        this.state = {pointSize: 2}
+        this.state = {
+            pointSize: 2,
+            selectionModeSimilarToggle: false
+        }
     }
 
 
@@ -26,6 +29,7 @@ export default class SseToolbar3d extends SseToolbar {
         this.addCommand("selectionAddCommand", "Selection Mode: Add", 2, "Y", "selection-mode-add", Plus, undefined, undefined);
         this.addCommand("selectionToggleCommand", "Selection Mode: Toggle", 2, "U", "selection-mode-toggle", PlusMinus, undefined, undefined);
         this.addCommand("selectionRemoveCommand", "Selection Mode: Remove", 2, "I", "selection-mode-remove", Minus, undefined, undefined);
+        this.addCommand("selectionSimilarCommand", "Selection Mode: Same RGB", 2, "O", "selection-mode-similar", Flare, undefined, undefined);
 
         this.addCommand("moreClusterCommand", "More Cluster", false, "ctrl+up", "cluster-more", Plus, undefined, "Ctrl \u2191");
         this.addCommand("lessClusterCommand", "Less Cluster", false, "ctrl+down", "cluster-less", Minus, undefined, "Ctrl \u2193");
@@ -40,14 +44,19 @@ export default class SseToolbar3d extends SseToolbar {
         this.addCommand("redoCommand", "Redo", false, "Ctrl+Y", "redo", Redo, "disabled");
         this.addCommand("downloadTextCommand", "PCD Output as Text", false, "", "downloadText", FileDownloadOutline);
         this.addCommand("downloadFileCommand", "PCD Output as File", false, "", "downloadFile", FileDownloadOutline);
+
         this.sendMsg("selector");
         this.sendMsg("selection-mode-add");
+
+        this.onMsg("show-rgb-toggle", () => {
+            this.setState({ selectionModeSimilarToggle: true })
+        });
     }
 
     render() {
         return (
             <div className="hflex flex-justify-content-space-around sse-toolbar toolbar-3d no-shrink">
-                <SseBranding/>
+                <SseBranding />
                 <div className="vflex">
                     <div className="tool-title">Selection Tool</div>
                     <div className="hflex">
@@ -62,6 +71,7 @@ export default class SseToolbar3d extends SseToolbar {
                         {this.renderCommand("selectionAddCommand")}
                         {this.renderCommand("selectionToggleCommand")}
                         {this.renderCommand("selectionRemoveCommand")}
+                        {this.state.selectionModeSimilarToggle ? this.renderCommand("selectionSimilarCommand") : null}
                     </div>
                 </div>
                 <div className="vflex">

imports/editor/3d/SseTooltips3d.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import {Rotate3D} from "mdi-material-ui";
+import { Rotate3D } from "mdi-material-ui";
 
 export default class SseTooltips3d extends React.Component {
     render() {
@@ -22,6 +22,10 @@ export default class SseTooltips3d extends React.Component {
                 <p><strong>Remove Selection Mode</strong></p>
                 <p className="italic">With this mode, points are removed from to the current selection</p>
             </div>
+            <div id="selectionSimilarCommand">
+                <p><strong>Add all objects with the same color</strong></p>
+                <p className="italic">With this mode, all points with the same RGB color are added to the current selection</p>
+            </div>
             <div id="autoFocusCommandHelp">
                 <p>Automatically adapt the view to the current selection</p>
             </div>
@@ -32,7 +36,7 @@ export default class SseTooltips3d extends React.Component {
             </div>
             <div id="viewCameraCommandHelp">
                 <p>Move the camera to the origin.</p>
-                <p>Use <Rotate3D/> to change the orientation of the camera</p>
+                <p>Use <Rotate3D /> to change the orientation of the camera</p>
             </div>
             <div id="viewCenterCommandHelp">
                 <p>Adjust the view to fit all points</p>