malty/ca-grow-ops-manager
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: improve 3d viewer legibility with rack visualization and larger labels
Some checks are pending
Deploy to Production / deploy (push) Waiting to run
Details
Test / backend-test (push) Waiting to run
Details
Test / frontend-test (push) Waiting to run
Details

Browse source
This commit is contained in:
fullsizemalt 2025-12-17 23:07:00 -08:00
parent 43f8c5a105
commit 9ac0261a17
1 changed files with 73 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

81
frontend/src/pages/Facility3DViewerPage.tsx
View file

@ -232,15 +232,15 @@ function FacilityScene({ data, onSelectPlant, targetView, setControls, visMode }
{showLabel ? room.name : ''} {showLabel ? room.name : ''}
</Text> </Text>
{/* Env Data Label Overlay */} {/* Env Data Label Overlay - INCREASED SIZE significantly */}
{(visMode === 'TEMP' || visMode === 'HUMIDITY') && ( {(visMode === 'TEMP' || visMode === 'HUMIDITY') && (
<Text <Text
position={[room.width / 2, 3, room.height / 2]} position={[room.width / 2, 5, room.height / 2]}
rotation={[-Math.PI / 4, 0, 0]} // Tilted up rotation={[-Math.PI / 4, 0, 0]}
fontSize={2} fontSize={6} // Increased from 2 to 6 for readability
color="white" color="white"
outlineColor="#000" outlineColor="#000"
outlineWidth={0.1} outlineWidth={0.2}
anchorX="center" anchorX="center"
anchorY="bottom" anchorY="bottom"
> >
@ -272,19 +272,84 @@ function FacilityScene({ data, onSelectPlant, targetView, setControls, visMode }
const spacing = 0.5; const spacing = 0.5;
const x = section.posX + (pos.column * spacing); const x = section.posX + (pos.column * spacing);
const z = section.posY + (pos.row * spacing); const z = section.posY + (pos.row * spacing);
const y = 0.5 + (pos.tier * 0.5); const y = 0.5 + (pos.tier * 0.8); // Increased vertical spacing for tiers
return { ...pos, x, y, z }; return { ...pos, x, y, z };
}); });
// Calculate visual bounds for labels
const distinctRows = [...new Set(positions.map(p => p.row))].sort((a, b) => a - b);
const distinctCols = [...new Set(positions.map(p => p.column))].sort((a, b) => a - b);
const distinctTiers = [...new Set(positions.map(p => p.tier))].sort((a, b) => a - b);
const spacing = 0.5;
return ( return (
<group key={section.id}> <group key={section.id}>
{/* Section Label */}
<Text <Text
position={[section.posX + (section.width / 2), 3, section.posY + (section.height / 2)]} position={[section.posX + (section.width / 2), 4, section.posY + (section.height / 2)]}
fontSize={0.8} fontSize={1.2}
color="#9ca3af" color="#9ca3af"
anchorX="center"
anchorY="bottom"
> >
{visMode === 'STANDARD' ? section.code : ''} {visMode === 'STANDARD' ? section.code : ''}
</Text> </Text>
{/* VISUAL CUES: Shelves per Tier */}
{distinctTiers.map(tier => (
<mesh
key={`shelf-${tier}`}
position={[
section.posX + (section.width / 2),
0.5 + (tier * 0.8) - 0.1, // Just below the plant base
section.posY + (section.height / 2)
]}
rotation={[-Math.PI / 2, 0, 0]}
>
<planeGeometry args={[section.width, section.height]} />
<meshStandardMaterial color="#374151" transparent opacity={0.5} side={THREE.DoubleSide} />
</mesh>
))}
{/* ROW LABELS (Along Z-axis) */}
{visMode === 'STANDARD' && distinctRows.map(row => (
<Text
key={`lbl-row-${row}`}
position={[
section.posX - 0.4,
1,
section.posY + (row * spacing)
]}
rotation={[-Math.PI / 2, 0, 0]}
fontSize={0.25}
color="#6b7280"
anchorX="right"
anchorY="middle"
>
R{row}
</Text>
))}
{/* COLUMN LABELS (Along X-axis) */}
{visMode === 'STANDARD' && distinctCols.map(col => (
<Text
key={`lbl-col-${col}`}
position={[
section.posX + (col * spacing),
0.2, // On floor
section.posY + section.height + 0.3
]}
rotation={[-Math.PI / 2, 0, 0]}
fontSize={0.25}
color="#6b7280"
anchorX="center"
anchorY="top"
>
C{col}
</Text>
))}
<PlantInstances positions={positions} onPlantClick={onSelectPlant} visMode={visMode} /> <PlantInstances positions={positions} onPlantClick={onSelectPlant} visMode={visMode} />
</group> </group>
); );