changed the heatmap limit to use the grain height

src/3dModels/Shapes/BaseMesh.tsx

@@ -79,9 +79,9 @@ export default function BaseMesh(props: BaseMeshProps) {
     };
 
     return (
-        <group position={position} rotation={rotation} renderOrder={renderOrder}>
+        <group position={position} rotation={rotation}>
             {/* Main surface */}
-            <mesh geometry={geometry} onClick={onClick}>
+            <mesh geometry={geometry} onClick={onClick} renderOrder={renderOrder}>
                 {buildMaterial()}
             </mesh>
 

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

@@ -1,3 +1,4 @@
+
 import OrbitCameraControls from "3dModels/CameraControls/OrbitCameraControls";
 import { Canvas } from "@react-three/fiber";
 import { Bin } from "models";
@@ -10,51 +11,54 @@ import { BuildCableData, CableData } from "../Data/BuildCableData";
 import { BuildNodeData, NodeData } from "../Data/BuildNodeData";
 import { pond } from "protobuf-ts/pond";
 import GrainCableFill from "../Systems/Inventory/GrainCableFill";
-import TempHeatMap from "../Systems/Heatmap/TempHeatMap"; //grain heat map
+import TempHeatMap from "../Systems/Heatmap/TempHeatMap";
-import NodePointCloud from "../Systems/Heatmap/NodePointCloud"; //hot spots
+import NodePointCloud from "../Systems/Heatmap/NodePointCloud";
  
 interface Props {
-    /**
-     * The bin to generate a 3D model of
-     */
     bin: Bin
-    /**
-     * The scale to apply to the bin dimensions
-     * ie 100 would make the bin 1:100 scale
-     * @default 100
-     */
     scale: number
-    /**
-     * optional: the percent of the bin to fill using a level top, this will be used with manual and lidar controls
-     */
     fillPercent?: number
     nodeClick?: (node: NodeData, cable: CableData) => void
-    /**
-     * 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, showGrain, showHotspots } = props
+ 
     const binCenter = useMemo(() => new Vector3(0, 0, 0), []);
     const cableData = useMemo(() => BuildCableData(bin), [bin]);
     const nodeData  = useMemo(() => BuildNodeData(cableData), [cableData]);
  
+    const isCableInventory =
+        bin.inventoryControl() === pond.BinInventoryControl.BIN_INVENTORY_CONTROL_AUTOMATIC ||
+        bin.inventoryControl() === pond.BinInventoryControl.BIN_INVENTORY_CONTROL_HYBRID_CABLE;
+ 
+    // For cable inventory, TempHeatMap derives the wavy surface directly from
+    // the top nodes in nodeData — no scalar needed.
+    //
+    // For flat fill percent, we convert the fill percent to a Y coordinate
+    // using the same volume math as GrainFillFlat and pass it as flatMaxY.
+    const flatMaxY = useMemo(() => {
+        if (isCableInventory || fillPercent === undefined) return undefined;
+ 
+        const radius     = bin.diameter() / 2;
+        const sidewallH  = bin.sidewallHeight();
+        const hopperH    = bin.hopperHeight() ?? 0;
+        const cylVolume  = Math.PI * radius * radius * sidewallH;
+        const hopperVol  = hopperH > 0 ? (1 / 3) * Math.PI * radius * radius * hopperH : 0;
+        const filled     = (cylVolume + hopperVol) * fillPercent;
+ 
+        const cylinderFillH = hopperH > 0 && filled <= hopperVol
+            ? 0
+            : Math.max(0, (filled - hopperVol) / (Math.PI * radius * radius));
+ 
+        return -sidewallH / 2 + cylinderFillH;
+    }, [isCableInventory, fillPercent, bin]);
+ 
     const grainInventory = () => {
-        if(bin.inventoryControl() === pond.BinInventoryControl.BIN_INVENTORY_CONTROL_AUTOMATIC ||
+        if (isCableInventory) {
-           bin.inventoryControl() === pond.BinInventoryControl.BIN_INVENTORY_CONTROL_HYBRID_CABLE){
             return (
                 <GrainCableFill
                     diameter={bin.diameter()}
@@ -66,6 +70,7 @@ export default function Bin3dView(props: Props){
                 />
             )
         } else if (fillPercent) {
+            return (
                 <GrainFillFlat
                     diameter={bin.diameter()}
                     sidewallHeight={bin.sidewallHeight()}
@@ -73,6 +78,7 @@ export default function Bin3dView(props: Props){
                     fillPercent={fillPercent}
                     grainOpacity={0.3}
                 />
+            )
         }
     }
  
@@ -92,23 +98,30 @@ export default function Bin3dView(props: Props){
                     renderOrder={4}
                 />
  
-                {/* grain - cylinder*/}
                 {showGrain && grainInventory()}
-                {/* cables */}
+ 
-                <BinCables cableData={cableData} nodeData={nodeData} bin={bin} binCenter={binCenter} 
+                <BinCables
+                    cableData={cableData}
+                    nodeData={nodeData}
+                    bin={bin}
+                    binCenter={binCenter}
                     onNodeClick={(node, cable) => {
-                        // console.log(node)
+                        if (nodeClick) nodeClick(node, cable)
-                        // console.log(cable)
-                        if(nodeClick){
-                            nodeClick(node, cable)
-                        }
                     }}
-                    renderOrder={1}/>
+                    renderOrder={1}
+                />
+ 
                 {showHotspots && <NodePointCloud bin={bin} nodes={nodeData} />}
-                {showHeatmap && <TempHeatMap bin={bin} nodes={nodeData}/>}
+ 
+                {showHeatmap && (
+                    <TempHeatMap
+                        bin={bin}
+                        nodes={nodeData}
+                        flatMaxY={flatMaxY}
+                    />
+                )}
             </group>
  
-                {/* lighting */}
             <ambientLight intensity={0.2} color={"white"} />
             <directionalLight intensity={0.2} color={"white"} position={[0, 0, 5]} />
             <directionalLight intensity={0.2} color={"white"} position={[0, 0, -5]} />

src/bin/3dView/Systems/Heatmap/TempHeatMap.tsx

@@ -7,6 +7,11 @@ import React from "react";
 interface Props {
     bin: Bin;
     nodes: NodeData[];
+    /**
+     * For flat fill percent inventory — a scalar Y ceiling for the heatmap top.
+     * Used when there are no cable top nodes to drive a surface.
+     */
+    flatMaxY?: number;
 }
  
 const RADIAL_RINGS = 20;
@@ -21,40 +26,31 @@ const RED_OPACITY = 0.3;
 const GREEN_OPACITY = 0.3;
 const YELLOW_OPACITY = 0.8;
  
-// New tuning knobs
 const ANGLE_JITTER = 0.2;
 const RADIAL_JITTER = 0.05;
 const LAYER_TWIST = 0.22;
  
+// IDW power for the horizontal surface interpolation —
+// matches GrainCableFill's default of 2
+const SURFACE_IDW_POWER = 2;
+ 
 function tempToHeat(temp: number, upper: number): number {
     if (temp <= upper) return 0;
-
     const delta = temp - upper;
-
     if (delta >= RED_DELTA) return 2;
-
+    if (delta >= YELLOW_DELTA) return 1 + (delta - YELLOW_DELTA) / (RED_DELTA - YELLOW_DELTA);
-    if (delta >= YELLOW_DELTA) {
-        return 1 +
-            (delta - YELLOW_DELTA) /
-            (RED_DELTA - YELLOW_DELTA);
-    }
-
     return delta / YELLOW_DELTA;
 }
  
 function heatToRGB(heat: number): number[] {
-
     const GREEN  = [0, 0.5, 0.02];
     const YELLOW = [0.7, 0.86, 0.0];
     const RED    = [0.8, 0.0, 0.01];
  
-    if (heat <= 0)
+    if (heat <= 0) return GREEN;
-      return GREEN;
  
     if (heat <= 1) {
-  
         const t = Math.pow(heat, 0.75);
-  
         return [
             GREEN[0] + (YELLOW[0] - GREEN[0]) * t,
             GREEN[1] + (YELLOW[1] - GREEN[1]) * t,
@@ -63,7 +59,6 @@ function heatToRGB(heat:number): number[] {
     }
  
     const t = Math.pow(heat - 1, 0.75);
-  
     return [
         YELLOW[0] + (RED[0] - YELLOW[0]) * t,
         YELLOW[1] + (RED[1] - YELLOW[1]) * t,
@@ -72,56 +67,65 @@ function heatToRGB(heat:number): number[] {
 }
  
 interface TempAnchor {
-    x:number;
+    x: number; y: number; z: number;
-    y:number;
-    z:number;
     celcius: number;
 }
  
+interface SurfaceAnchor {
+    x: number; z: number; y: number;
+}
+ 
+// 3D IDW for temperature interpolation
 function idwTemp(
-    px:number,
+    px: number, py: number, pz: number,
-    py:number,
-    pz:number,
     anchors: TempAnchor[],
     power: number
 ): number {
-   
     let totalWeight = 0;
     let weightedSum = 0;
  
     for (const a of anchors) {
-   
         const dx = px - a.x;
         const dy = py - a.y;
         const dz = pz - a.z;
-   
         const distSq = dx * dx + dy * dy + dz * dz;
-   
+        if (distSq < 0.001) return a.celcius;
-      if (distSq < 0.001)
+        const weight = 1 / Math.pow(distSq, power / 2);
-         return a.celcius;
-   
-      const weight =
-         1 / Math.pow(distSq, power/2);
-   
         totalWeight += weight;
         weightedSum += a.celcius * weight;
     }
  
-    return totalWeight===0
+    return totalWeight === 0 ? 0 : weightedSum / totalWeight;
-    ? 0
-    : weightedSum/totalWeight;
 }
  
- // deterministic pseudo-random based on indices
+// 2D IDW for surface height interpolation — matches GrainCableFill exactly
- function hashNoise(a:number,b:number,c:number){
+function idwSurfaceY(
-     const x = Math.sin(
+    x: number, z: number,
-       a*127.1 + b*311.7 + c*74.7
+    anchors: SurfaceAnchor[],
-     ) * 43758.5453;
+    power: number
+): number {
+    let totalWeight = 0;
+    let weightedY   = 0;
  
+    for (const a of anchors) {
+        const dx = x - a.x;
+        const dz = z - a.z;
+        const distSq = dx * dx + dz * dz;
+        if (distSq < 0.001) return a.y;
+        const weight = 1 / Math.pow(distSq, power / 2);
+        totalWeight += weight;
+        weightedY   += a.y * weight;
+    }
+ 
+    return totalWeight === 0 ? 0 : weightedY / totalWeight;
+}
+ 
+function hashNoise(a: number, b: number, c: number) {
+    const x = Math.sin(a * 127.1 + b * 311.7 + c * 74.7) * 43758.5453;
     return (x - Math.floor(x)) * 2 - 1;
 }
- export default function TempHeatMapGPT({bin,nodes}:Props){
  
+export default function TempHeatMap({ bin, nodes, flatMaxY }: Props) {
     const binRadius      = bin.diameter() / 2;
     const sidewallHeight = bin.sidewallHeight();
     const hopperHeight   = bin.hopperHeight() ?? 0;
@@ -131,18 +135,15 @@ interface TempAnchor {
     const hopperTipY    = sidewallBaseY - hopperHeight;
  
     const maxRadiusAtY = (y: number) => {
-   
+        if (y >= sidewallBaseY) return binRadius;
-      if(y>=sidewallBaseY)
+        if (hopperHeight <= 0 || y <= hopperTipY) return 0;
-         return binRadius;
+        return binRadius * ((y - hopperTipY) / hopperHeight);
-   
-      if(hopperHeight<=0 || y<=hopperTipY)
-         return 0;
-   
-      return binRadius*
-         ((y-hopperTipY)/hopperHeight);
     };
-    const anchors=useMemo(
+ 
-        ()=>nodes
+    // Temperature anchors — all in-grain nodes
+    const tempAnchors = useMemo<TempAnchor[]>(
+        () =>
+            nodes
                 .filter(n => n.inGrain && !n.excluded)
                 .map(n => ({
                     x: n.position.x,
@@ -153,151 +154,155 @@ interface TempAnchor {
         [nodes]
     );
  
-      const maxGrainY=useMemo(()=>{
+    // Surface anchors — top nodes only, Y offset by half spacing
-         let maxY=sidewallBaseY;
+    // Matches GrainCableFill's anchor computation exactly.
-     
+    const surfaceAnchors = useMemo<SurfaceAnchor[]>(
-         for(const a of anchors)
+        () =>
-           if(a.y>maxY)
+            nodes
-              maxY=a.y;
+                .filter(n => n.topNode && n.inGrain && !n.excluded)
-     
+                .map(n => ({
-         return maxY;
+                    x: n.position.x,
-      },[anchors,sidewallBaseY]);
+                    z: n.position.z,
-
+                    y: n.position.y + n.nodeSpacing * 0.5,
-      const geometry=useMemo(()=>{
+                })),
-
+        [nodes]
-        if(!anchors.length)
-          return null;
-       
-        const pointsPerLayer=
-          1 + RADIAL_RINGS*THETA_SEGMENTS;
-       
-        const totalVerts=
-          HEIGHT_STEPS*pointsPerLayer +1;
-       
-        const positions=
-          new Float32Array(totalVerts*3);
-       
-        const colors=
-          new Float32Array(totalVerts*3);
-
-        const heats=new Float32Array(totalVerts);
-       
-        const rawBottomY=
-          hopperHeight>0
-             ? hopperTipY
-             : sidewallBaseY;
-       
-        const grainBottomY=
-          hopperHeight>0
-            ? hopperTipY +
-              (maxGrainY-hopperTipY)/HEIGHT_STEPS
-            : sidewallBaseY;
-       
-        const grainHeight=
-          maxGrainY-grainBottomY;
-
-          if(grainHeight<=0)
-            return null;
-         
-          for(let hStep=0; hStep<HEIGHT_STEPS; hStep++){
-         
-            const t=hStep/(HEIGHT_STEPS-1);
-            const y=grainBottomY+t*grainHeight;
-         
-            const allowedRadius=
-               maxRadiusAtY(y)*0.97;
-         
-            const layerBase=
-               hStep*pointsPerLayer;
-         
-            const centerTemp=
-               idwTemp(
-                  0,y,0,
-                  anchors,
-                  IDW_POWER
     );
  
-            const centerHeat=
+    // Wall clamp Y — average of surface anchor heights.
-               tempToHeat(centerTemp,upperThreshold);
+    // Prevents the surface from piling up at the bin wall where there are no cables.
+    // Matches GrainCableFill's wallY computation.
+    const wallY = useMemo(() => {
+        if (surfaceAnchors.length === 0) return flatMaxY ?? sidewallBaseY;
+        return surfaceAnchors.reduce((sum, a) => sum + a.y, 0) / surfaceAnchors.length;
+    }, [surfaceAnchors, flatMaxY, sidewallBaseY]);
  
-            const [cr,cg,cb]=
+    // For each (x, z) position, returns the Y ceiling of the grain surface.
-               heatToRGB(centerHeat);
+    // Uses cable surface IDW when top nodes exist, falls back to flatMaxY.
+    const getSurfaceY = (x: number, z: number): number => {
+        if (surfaceAnchors.length > 0) {
+            // Outermost ring clamps to wallY — matches GrainCableFill
+            const raw = idwSurfaceY(x, z, surfaceAnchors, SURFACE_IDW_POWER);
+            return Math.max(sidewallBaseY, Math.min(sidewallHeight / 2, raw));
+        }
+        return flatMaxY ?? sidewallBaseY;
+    };
+ 
+    // Global max Y — highest point of the surface (used for grid bottom calc)
+    const maxGrainY = useMemo(() => {
+        if (surfaceAnchors.length > 0) {
+            return Math.max(...surfaceAnchors.map(a => a.y), wallY);
+        }
+        return flatMaxY ?? sidewallBaseY;
+    }, [surfaceAnchors, wallY, flatMaxY, sidewallBaseY]);
+ 
+    const geometry = useMemo(() => {
+        if (!tempAnchors.length) return null;
+ 
+        const pointsPerLayer = 1 + RADIAL_RINGS * THETA_SEGMENTS;
+        const totalVerts     = HEIGHT_STEPS * pointsPerLayer + 1;
+ 
+        const positions = new Float32Array(totalVerts * 3);
+        const colors    = new Float32Array(totalVerts * 3);
+        const heats     = new Float32Array(totalVerts);
+ 
+        const rawBottomY   = hopperHeight > 0 ? hopperTipY : sidewallBaseY;
+        const grainBottomY = hopperHeight > 0
+            ? hopperTipY + (maxGrainY - hopperTipY) / HEIGHT_STEPS
+            : sidewallBaseY;
+        const grainHeight  = maxGrainY - grainBottomY;
+ 
+        if (grainHeight <= 0) return null;
+ 
+        // Pre-compute the (x, z) position for each (ring, seg) slot so we
+        // can look up the surface Y ceiling per column
+        const colX: number[] = new Array(RADIAL_RINGS * THETA_SEGMENTS);
+        const colZ: number[] = new Array(RADIAL_RINGS * THETA_SEGMENTS);
+        const colSurfaceY: number[] = new Array(RADIAL_RINGS * THETA_SEGMENTS);
+ 
+        // Use the outermost layer's radius for surface Y lookup (no jitter/twist)
+        // so the surface shape matches GrainCableFill cleanly
+        const topLayerAllowedRadius = maxRadiusAtY(maxGrainY) * 0.97;
+ 
+        for (let ring = 0; ring < RADIAL_RINGS; ring++) {
+            const u     = (ring + 1) / RADIAL_RINGS;
+            const rFrac = 1 - Math.pow(1 - u, 2.2);
+            const r     = rFrac * topLayerAllowedRadius;
+ 
+            for (let seg = 0; seg < THETA_SEGMENTS; seg++) {
+                const angle = (seg / THETA_SEGMENTS) * Math.PI * 2;
+                const x = Math.cos(angle) * r;
+                const z = Math.sin(angle) * r;
+                const ci = ring * THETA_SEGMENTS + seg;
+                colX[ci]        = x;
+                colZ[ci]        = z;
+                // Outermost ring uses wallY, inner rings use full IDW surface
+                colSurfaceY[ci] = ring === RADIAL_RINGS - 1
+                    ? wallY
+                    : getSurfaceY(x, z);
+            }
+        }
+        // Center column surface Y
+        const centerSurfaceY = getSurfaceY(0, 0);
+ 
+        for (let hStep = 0; hStep < HEIGHT_STEPS; hStep++) {
+            const t = hStep / (HEIGHT_STEPS - 1);
+ 
+            const layerBase     = hStep * pointsPerLayer;
+            const allowedRadius = maxRadiusAtY(grainBottomY + t * grainHeight) * 0.97;
+ 
+            // Center vertex — Y is lerped from bottom to its column surface ceiling
+            const centerY = grainBottomY + t * (centerSurfaceY - grainBottomY);
+ 
+            const centerTemp = idwTemp(0, centerY, 0, tempAnchors, IDW_POWER);
+            const centerHeat = tempToHeat(centerTemp, upperThreshold);
+            const [cr, cg, cb] = heatToRGB(centerHeat);
  
             positions[layerBase * 3]     = 0;
-   positions[layerBase*3+1]=y;
+            positions[layerBase * 3 + 1] = centerY;
             positions[layerBase * 3 + 2] = 0;
-
             colors[layerBase * 3]        = cr;
             colors[layerBase * 3 + 1]    = cg;
             colors[layerBase * 3 + 2]    = cb;
+            heats[layerBase]             = centerHeat;
  
             for (let ring = 0; ring < RADIAL_RINGS; ring++) {
-
-    //biases density towards the walls of the bin
                 const u     = (ring + 1) / RADIAL_RINGS;
                 const rFrac = 1 - Math.pow(1 - u, 2.2);
  
                 for (let seg = 0; seg < THETA_SEGMENTS; seg++) {
+                    const noiseA = hashNoise(hStep, ring, seg);
+                    const noiseR = hashNoise(seg, hStep, ring + 11);
  
-        const noiseA=
+                    const baseRadius    = rFrac * allowedRadius;
-          hashNoise(hStep,ring,seg);
+                    const jitterRadius  = baseRadius + noiseR * RADIAL_JITTER * allowedRadius;
-
+                    const r             = Math.max(0, Math.min(jitterRadius, allowedRadius));
-        const noiseR=
-          hashNoise(seg,hStep,ring+11);
-
-        const baseRadius=
-           rFrac*allowedRadius;
-
-        const jitterRadius=
-          baseRadius +
-          noiseR*
-          RADIAL_JITTER*
-          allowedRadius;
-
-          const r=Math.max(
-            0,
-            Math.min(
-               jitterRadius,
-               allowedRadius
-            )
-          );
-  
-          const layerPhase=
-             t*LAYER_TWIST;
  
+                    const layerPhase = t * LAYER_TWIST;
                     const angle      =
-             (seg/THETA_SEGMENTS)
+                        (seg / THETA_SEGMENTS) * Math.PI * 2 +
-               *Math.PI*2
+                        layerPhase +
-            + layerPhase
+                        noiseA * ANGLE_JITTER;
-            + noiseA*ANGLE_JITTER;
  
                     const x = Math.cos(angle) * r;
                     const z = Math.sin(angle) * r;
  
-          const temp=idwTemp(
+                    // Per-column surface Y ceiling — this is what gives the wavy top
-             x,y,z,
+                    const ci       = ring * THETA_SEGMENTS + seg;
-             anchors,
+                    const surfaceY = colSurfaceY[ci];
-             IDW_POWER
-          );
  
-          const heat=
+                    // Lerp this vertex Y from grainBottomY up to its column surface ceiling
-            tempToHeat(temp,upperThreshold);
+                    const y = grainBottomY + t * (surfaceY - grainBottomY);
  
-            const [vr,vg,vb]=
+                    const temp = idwTemp(x, y, z, tempAnchors, IDW_POWER);
-          heatToRGB(heat);
+                    const heat = tempToHeat(temp, upperThreshold);
+                    const [vr, vg, vb] = heatToRGB(heat);
  
-        const vi=
+                    const vi = layerBase + 1 + ring * THETA_SEGMENTS + seg;
-         layerBase+
-         1+
-         ring*THETA_SEGMENTS+
-         seg;
  
                     heats[vi]             = heat;
-
                     positions[vi * 3]     = x;
                     positions[vi * 3 + 1] = y;
                     positions[vi * 3 + 2] = z;
-
                     colors[vi * 3]        = vr;
                     colors[vi * 3 + 1]    = vg;
                     colors[vi * 3 + 2]    = vb;
@@ -305,24 +310,10 @@ interface TempAnchor {
             }
         }
  
- const idx=(
+        const idx = (hStep: number, ring: number, seg: number) => {
-   hStep:number,
+            if (ring < 0) return hStep * pointsPerLayer;
-   ring:number,
+            const s = ((seg % THETA_SEGMENTS) + THETA_SEGMENTS) % THETA_SEGMENTS;
-   seg:number
+            return hStep * pointsPerLayer + 1 + ring * THETA_SEGMENTS + s;
- )=>{
-
- if(ring<0)
-   return hStep*pointsPerLayer;
-
- const s=
-  ((seg%THETA_SEGMENTS)
-   +THETA_SEGMENTS)
-   %THETA_SEGMENTS;
-
- return hStep*pointsPerLayer+
-   1+
-   ring*THETA_SEGMENTS+
-   s;
         };
  
         const green:  number[] = [];
@@ -330,33 +321,20 @@ interface TempAnchor {
         const red:    number[] = [];
  
         function pushTri(a: number, b: number, c: number) {
-
+            const avg = (heats[a] + heats[b] + heats[c]) / 3;
-   const avg=(
+            if (avg < 1)      green.push(a, b, c);
-      heats[a]+heats[b]+heats[c]
+            else if (avg < 2) yellow.push(a, b, c);
-   )/3;
+            else              red.push(a, b, c);
-
-   if(avg<1)
-      green.push(a,b,c);
-   else if(avg<2)
-      yellow.push(a,b,c);
-   else
-      red.push(a,b,c);
         }
  
         for (let h = 0; h < HEIGHT_STEPS - 1; h++) {
-
             for (let ring = 0; ring < RADIAL_RINGS - 1; ring++) {
                 for (let seg = 0; seg < THETA_SEGMENTS; seg++) {
- 
                     const next = (seg + 1) % THETA_SEGMENTS;
- 
                     const a = idx(h,     ring, seg);
                     const b = idx(h,     ring, next);
                     const e = idx(h + 1, ring, seg);
                     const f = idx(h + 1, ring, next);
- 
-        //   indices.push(a,e,b);
-        //   indices.push(e,f,b);
                     pushTri(a, e, b);
                     pushTri(e, f, b);
                 }
@@ -364,74 +342,46 @@ interface TempAnchor {
  
             // center fill
             for (let seg = 0; seg < THETA_SEGMENTS; seg++) {
-
                 const next    = (seg + 1) % THETA_SEGMENTS;
-       
                 const center0 = idx(h,     -1, 0);
                 const center1 = idx(h + 1, -1, 0);
-       
                 const a = idx(h,     0, seg);
                 const b = idx(h,     0, next);
-       
                 const c = idx(h + 1, 0, seg);
                 const d = idx(h + 1, 0, next);
-       
                 pushTri(center0, c, a);
                 pushTri(center0, center1, c);
                 pushTri(a, c, b);
                 pushTri(b, c, d);
             }
         }
-  const tipVertexIndex=
-   HEIGHT_STEPS*pointsPerLayer;
  
+        // Hopper tip
+        const tipVertexIndex = HEIGHT_STEPS * pointsPerLayer;
         if (hopperHeight > 0) {
-
+            const tipTemp = idwTemp(0, rawBottomY, 0, tempAnchors, IDW_POWER);
-   const tipTemp=idwTemp(
+            const tipHeat = tempToHeat(tipTemp, upperThreshold);
-      0,
+            const [tr, tg, tb] = heatToRGB(tipHeat);
-      rawBottomY,
-      0,
-      anchors,
-      IDW_POWER
-   );
-
-   const tipHeat=
-      tempToHeat(
-         tipTemp,
-         upperThreshold
-      );
-
-   const [tr,tg,tb]=
-      heatToRGB(tipHeat);
  
             positions[tipVertexIndex * 3]     = 0;
             positions[tipVertexIndex * 3 + 1] = rawBottomY;
             positions[tipVertexIndex * 3 + 2] = 0;
-
             colors[tipVertexIndex * 3]        = tr;
             colors[tipVertexIndex * 3 + 1]    = tg;
             colors[tipVertexIndex * 3 + 2]    = tb;
-   const outerRing=RADIAL_RINGS-1;
+            heats[tipVertexIndex]             = tipHeat;
  
+            const outerRing = RADIAL_RINGS - 1;
             for (let seg = 0; seg < THETA_SEGMENTS; seg++) {
                 const next = (seg + 1) % THETA_SEGMENTS;
-
+                pushTri(tipVertexIndex, idx(0, outerRing, next), idx(0, outerRing, seg));
-      const a=idx(0,outerRing,seg);
-      const b=idx(0,outerRing,next);
-    pushTri(tipVertexIndex,b,a)
             }
         }
  
         function makeGeo(indices: number[]) {
             const g = new THREE.BufferGeometry();
-    g.setAttribute(
+            g.setAttribute("position", new THREE.BufferAttribute(positions, 3));
-      'position',
+            g.setAttribute("color",    new THREE.BufferAttribute(colors, 3));
-      new THREE.BufferAttribute(positions,3)
-    );
-    g.setAttribute(
-      'color',
-      new THREE.BufferAttribute(colors,3)
-    );
             g.setIndex(indices);
             return g;
         }
@@ -439,21 +389,23 @@ function makeGeo(indices:number[]){
         return {
             green:  makeGeo(green),
             yellow: makeGeo(yellow),
-    red:makeGeo(red)
+            red:    makeGeo(red),
         };
- 
     }, [
-  anchors,
+        tempAnchors,
+        surfaceAnchors,
+        wallY,
         maxGrainY,
         hopperTipY,
         sidewallBaseY,
         binRadius,
         upperThreshold,
         hopperHeight,
+        flatMaxY,
     ]);
  
- if(!geometry)
+    if (!geometry) return null;
-  return null;
+ 
     return (
         <React.Fragment>
             <mesh geometry={geometry.green} renderOrder={1}>
@@ -487,5 +439,4 @@ function makeGeo(indices:number[]){
             </mesh>
         </React.Fragment>
     );
-   
 }