fix: Finalize AUTO-FIT implementation in JSX
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 18:39:57 -08:00
parent 494ea2f01a
commit 8866341a8f

View file

@ -61,17 +61,31 @@ export function Room3DViewer({ room, visMode = 'STANDARD', onPlantClick }: Room3
}, [room]); }, [room]);
return ( return (
<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-slate-950 rounded-2xl overflow-hidden border border-[var(--color-border-subtle)] relative">
<Canvas <Canvas
shadows shadows
orthographic orthographic
camera={{ position: [200, 200, 200], zoom: 30, near: -500, far: 1500 }} camera={{ position: [100, 100, 100], zoom: 40, near: -500, far: 2000 }}
className="w-full h-full" className="w-full h-full"
> >
<ambientLight intensity={0.7} /> <ambientLight intensity={0.7} />
<directionalLight position={[10, 50, 20]} intensity={1.5} castShadow /> <directionalLight position={[10, 50, 20]} intensity={1.5} castShadow />
<group position={[0, -5, 0]}> {/* Grid Floor for context */}
<Grid
infiniteGrid
fadeDistance={200}
sectionColor="#10b981"
cellColor="#059669"
sectionThickness={1}
cellThickness={0.5}
opacity={0.15}
position={[0, -0.1, 0]}
args={[10.5, 10.5]}
/>
<Bounds fit clip observe margin={1.2}>
<group position={[0, 0, 0]}>
<RoomObject <RoomObject
room={room3DData} room={room3DData}
visMode={visMode} visMode={visMode}
@ -85,8 +99,8 @@ export function Room3DViewer({ room, visMode = 'STANDARD', onPlantClick }: Room3
}} }}
/> />
</group> </group>
</Bounds>
<ContactShadows position={[0, -5.01, 0]} opacity={0.3} scale={60} blur={2} far={20} />
<Environment preset="city" /> <Environment preset="city" />
<OrbitControls <OrbitControls
makeDefault makeDefault
@ -96,8 +110,8 @@ export function Room3DViewer({ room, visMode = 'STANDARD', onPlantClick }: Room3
/> />
</Canvas> </Canvas>
<div className="absolute bottom-4 right-4 bg-slate-900/90 backdrop-blur-md px-3 py-1.5 rounded-md border border-white/20 text-xs font-mono text-emerald-400 pointer-events-none shadow-xl"> <div className="absolute bottom-4 right-4 bg-slate-900/90 backdrop-blur-md px-3 py-1.5 rounded-md border border-emerald-500/20 text-xs font-mono text-emerald-400 pointer-events-none shadow-xl">
VIEW: ISOMETRIC // FIXED VIEW: ISOMETRIC // FIXED // AUTO-FIT
</div> </div>
</div> </div>
); );