fix: Switch to Orthographic 3D view and use HTML labels
Some checks are pending
Test / backend-test (push) Waiting to run
Test / frontend-test (push) Waiting to run

This commit is contained in:
fullsizemalt 2025-12-27 17:21:00 -08:00
parent dc2cfd13ad
commit dc2f491fa9
2 changed files with 13 additions and 6 deletions

View file

@ -64,13 +64,14 @@ export function Room3DViewer({ room, visMode = 'STANDARD', onPlantClick }: Room3
<div className="w-full h-[600px] bg-gradient-to-br from-slate-900 to-slate-950 rounded-2xl overflow-hidden border border-[var(--color-border-subtle)] relative"> <div className="w-full h-[600px] bg-gradient-to-br from-slate-900 to-slate-950 rounded-2xl overflow-hidden border border-[var(--color-border-subtle)] relative">
<Canvas <Canvas
shadows shadows
camera={{ position: [0, 40, 30], fov: 45 }} orthographic
camera={{ position: [50, 40, 50], zoom: 8, near: -100, far: 200 }}
className="w-full h-full" className="w-full h-full"
> >
<ambientLight intensity={0.5} /> <ambientLight intensity={0.6} />
<directionalLight position={[10, 20, 10]} intensity={1} castShadow /> <directionalLight position={[10, 40, 20]} intensity={1.2} castShadow />
<group position={[0, 0, 0]}> <group position={[0, -5, 0]}>
<RoomObject <RoomObject
room={room3DData} room={room3DData}
visMode={visMode} visMode={visMode}
@ -85,9 +86,14 @@ export function Room3DViewer({ room, visMode = 'STANDARD', onPlantClick }: Room3
/> />
</group> </group>
<ContactShadows position={[0, -0.01, 0]} opacity={0.4} scale={40} blur={2} far={10} /> <ContactShadows position={[0, -5.01, 0]} opacity={0.3} scale={60} blur={2.5} far={20} />
<Environment preset="city" /> <Environment preset="city" />
<OrbitControls makeDefault minPolarAngle={0} maxPolarAngle={Math.PI / 2.2} /> <OrbitControls
makeDefault
enableRotate={true}
maxPolarAngle={Math.PI / 2.5} // Limit vertical rotation to keep "looking down" feel
minPolarAngle={Math.PI / 6}
/>
</Canvas> </Canvas>
<div className="absolute bottom-4 right-4 bg-black/60 backdrop-blur-md px-3 py-1.5 rounded-full border border-white/10 text-xs font-medium text-white/80 pointer-events-none"> <div className="absolute bottom-4 right-4 bg-black/60 backdrop-blur-md px-3 py-1.5 rounded-full border border-white/10 text-xs font-medium text-white/80 pointer-events-none">

View file

@ -5,6 +5,7 @@ import type { Room3D } from '../../lib/layoutApi';
import { PlantPosition, VisMode, COLORS } from './types'; import { PlantPosition, VisMode, COLORS } from './types';
import { SmartRack, HierarchyContext } from './SmartRack'; import { SmartRack, HierarchyContext } from './SmartRack';
import { RoomSummaryOverlay } from './SummaryOverlay'; import { RoomSummaryOverlay } from './SummaryOverlay';
import { cn } from '../../lib/utils';
// Convert pixel coordinates to world units // Convert pixel coordinates to world units
const SCALE = 0.1; const SCALE = 0.1;