brandxtech/frontend
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

changed the orbital camera to allow for an offset without messing with the rotation, added a moisture heatmap, updated the bin3dvisualizer to look cleaner, re-implemented a new version of the dialog box that pops up when clicking a node

Browse source
This commit is contained in:
csawatzky 2026-05-13 14:32:52 -06:00
parent 619f9b7bf4
commit f54d4b5375
15 changed files with 1349 additions and 214 deletions
Download patch file Download diff file Expand all files Collapse all files

41
src/bin/3dView/Scene/Bin3dView.tsx
View file

@ -15,10 +15,18 @@ import GrainCableFill from "../Systems/Inventory/GrainCableFill";
import TempHeatMap from "../Systems/Heatmap/TempHeatMap";
import NodePointCloud from "../Systems/Heatmap/NodePointCloud";
import { Box } from "@mui/material";
import MoistureHeatMap from "../Systems/Heatmap/MoistureHeatmap";
// import { GrainCable } from "models/GrainCable";
interface Props {
bin: Bin
scale: number
/**
* cables can come from the bins status when not passed in, however data may be out of synce from when the cables read to when the bins status updates
* they may need to be passed in but for the moment we wont worry about it due to the last active on the bin page can be used to explain being out of sync
* if it becomes an issue I can make the changes necessary to pass the cable components in
*/
// cables?: GrainCable[]
fillPercent?: number
nodeClick?: (node: NodeData, cable: CableData) => void
showGrain?: boolean
@ -31,10 +39,11 @@ interface Props {
showResetButton?: boolean
showTemp?: boolean
showMoisture?: boolean
xOffset?: number
}
export default function Bin3dView(props: Props) {
const { bin, scale = 100, fillPercent, nodeClick, showTempHeatmap, showGrain, showHotspots, showResetButton, showMoistureHeatmap, showTemp, showMoisture } = props
const { bin, scale = 100, fillPercent, nodeClick, showTempHeatmap, showGrain, showHotspots, showResetButton, showMoistureHeatmap, showTemp, showMoisture, xOffset } = props
// Compute the initial camera radius so the full bin fits in frame.
// Uses the perspective camera FOV (default 75°) with a padding factor.
@ -105,7 +114,14 @@ export default function Bin3dView(props: Props) {
}
return (
<Canvas>
<Canvas style={{position: "absolute", inset: 0}}>
<OrbitCameraControls
clampVerticalRotation
initialRadius={initialCameraRadius}
maxRadius={initialCameraRadius * 2}
onReset={fn => { resetCameraFn.current = fn; }}
viewOffset={xOffset}
/>
<group scale={[1 / scale, 1 / scale, 1 / scale]}>
<BinShell
binBodyColour="#fff"
@ -131,11 +147,12 @@ export default function Bin3dView(props: Props) {
onNodeClick={(node, cable) => {
if (nodeClick) nodeClick(node, cable)
}}
renderOrder={1}
renderOrder={5}
/>
{showHotspots && <NodePointCloud bin={bin} nodes={nodeData} />}
{/* note that the heatmaps insternally use render order 1,2, and 3 for the three seperate coloured meshes */}
{showTempHeatmap && (
<TempHeatMap
bin={bin}
@ -143,6 +160,13 @@ export default function Bin3dView(props: Props) {
flatMaxY={flatMaxY}
/>
)}
{showMoistureHeatmap && (
<MoistureHeatMap
bin={bin}
nodes={nodeData}
flatMaxY={flatMaxY}
/>
)}
</group>
@ -151,16 +175,7 @@ export default function Bin3dView(props: Props) {
<directionalLight intensity={0.2} color={"white"} position={[0, 0, -5]} />
<directionalLight intensity={0.2} color={"white"} position={[5, 0, 0]} />
<directionalLight intensity={0.2} color={"white"} position={[-5, 0, 0]} />
<OrbitCameraControls
clampVerticalRotation
initialRadius={initialCameraRadius}
maxRadius={initialCameraRadius * 2}
onReset={fn => { resetCameraFn.current = fn; }}
/>
{/* <CameraOverlay
showResetButton={showResetButton}
onReset={() => resetCameraFn.current?.()}
/> */}
</Canvas>
)
}