updated the heatmap and added toggles

src/bin/3dView/Scene/Bin3dView.tsx

@@ -8,11 +8,10 @@ import { Vector3 } from "three";
 import { useMemo } from "react";
 import { BuildCableData, CableData } from "../Data/BuildCableData";
 import { BuildNodeData, NodeData } from "../Data/BuildNodeData";
-import Heatmap from "../Systems/Heatmap/HeatMapAlpha";
 import { pond } from "protobuf-ts/pond";
 import GrainCableFill from "../Systems/Inventory/GrainCableFill";
-import TempHeatMap from "../Systems/Heatmap/TempHeatMap";
-// import NodePointCloud from "../Systems/Heatmap/NodePointCloud";
+import TempHeatMap from "../Systems/Heatmap/TempHeatMap"; //grain heat map
+import NodePointCloud from "../Systems/Heatmap/NodePointCloud"; //hot spots
 
 interface Props {
     /**
@@ -31,16 +30,24 @@ interface Props {
     fillPercent?: number
     nodeClick?: (node: NodeData, cable: CableData) => void
     /**
-     * When true, renders the heatmap instead of the grain fill.
+     * toggles the grain in the bin
+     */
+    showGrain?: boolean
+    /**
+     * toggles the heatmap overlay
      */
     showHeatmap?: boolean
+    /**
+     * toggles the hotspots in the bin
+     */
+    showHotspots?: boolean
 }
 
 export default function Bin3dView(props: Props){
     //this function will generate a 3D model of a bin based on its settings using multiple meshes, cylinder for the body, cone for the roof
     // and either a cone for the hopper or circle for flat bottom, it is possible to also use lathe geometry for this as well, 
     // it might even work better because we can control the smoothness easier with it being only one mesh rather than 3
-    const {bin, scale = 100, fillPercent, nodeClick, showHeatmap = false} = props
+    const {bin, scale = 100, fillPercent, nodeClick, showHeatmap, showGrain, showHotspots} = props
     const binCenter = useMemo(() => new Vector3(0, 0, 0), []);
     const cableData = useMemo(() => BuildCableData(bin), [bin]);
     const nodeData = useMemo(() => BuildNodeData(cableData), [cableData]);
@@ -86,7 +93,7 @@ export default function Bin3dView(props: Props){
                 />
 
                 {/* grain - cylinder*/}
-                {/* {!showHeatmap && grainInventory()} */}
+                {showGrain && grainInventory()}
                 {/* cables */}
                 <BinCables cableData={cableData} nodeData={nodeData} bin={bin} binCenter={binCenter} 
                     onNodeClick={(node, cable) => {
@@ -97,8 +104,8 @@ export default function Bin3dView(props: Props){
                         }
                     }}
                     renderOrder={1}/>
-                {/* <NodePointCloud bin={bin} nodes={nodeData} /> */}
-                <TempHeatMap bin={bin} nodes={nodeData}/>
+                {showHotspots && <NodePointCloud bin={bin} nodes={nodeData} /> }
+                {showHeatmap && <TempHeatMap bin={bin} nodes={nodeData}/>}
               </group>
 
                 {/* lighting */}