diff --git a/app/src/components/three/Shelter3D.tsx b/app/src/components/three/Shelter3D.tsx index 98ff018..04d7538 100644 --- a/app/src/components/three/Shelter3D.tsx +++ b/app/src/components/three/Shelter3D.tsx @@ -138,24 +138,58 @@ function ShelterModel({ {/* Parede Lateral Direita (X = +halfW) */} {renderWallWithGap(depth, height, rightClosure, 'distributed', Math.PI / 2, [halfW, 0, 0])} - {/* Seta de Vento Global (Sempre visível para não pular de posição) */} - - - - Vento - - + {/* Setas de Vento Global (0°, 45°, 90°) */} + {[ + { + angle: 0, + label: 'Vento 0°', + target: [0, height * 1.5 - 1.5, -halfD - 4] as [number, number, number], + direction: [0, 0, 1] as [number, number, number], + textPos: [0, height * 1.5, -halfD - 6] as [number, number, number], + textRot: [0, Math.PI, 0] as [number, number, number], + }, + { + angle: 45, + label: 'Vento 45°', + target: [-halfW - 3, height * 1.5 - 1.5, -halfD - 3] as [number, number, number], + direction: [0.707, 0, 0.707] as [number, number, number], + textPos: [-halfW - 5, height * 1.5, -halfD - 5] as [number, number, number], + textRot: [0, Math.PI * 0.75, 0] as [number, number, number], + }, + { + angle: 90, + label: 'Vento 90°', + target: [-halfW - 4, height * 1.5 - 1.5, 0] as [number, number, number], + direction: [1, 0, 0] as [number, number, number], + textPos: [-halfW - 6, height * 1.5, 0] as [number, number, number], + textRot: [0, Math.PI / 2, 0] as [number, number, number], + } + ].map((arrow) => { + const isActive = windAngle === arrow.angle; + const arrowColor = isActive ? (isDark ? '#60a5fa' : '#2563eb') : (isDark ? '#475569' : '#94a3b8'); + return ( + + + + {arrow.label} + + + ); + })} {/* Partículas de Ar */} {isAirflow && ( diff --git a/app/src/components/three/WindArrow.tsx b/app/src/components/three/WindArrow.tsx index f14841b..d131364 100644 --- a/app/src/components/three/WindArrow.tsx +++ b/app/src/components/three/WindArrow.tsx @@ -8,11 +8,14 @@ export interface WindArrowProps { direction: THREE.Vector3 | [number, number, number]; /** Fator de escala da seta (default: 1) */ scale?: number; + /** Cor da seta */ + color?: string; + /** Opacidade da seta (0 a 1) */ + opacity?: number; } -export function WindArrow({ target, direction, scale = 1 }: WindArrowProps) { +export function WindArrow({ target, direction, scale = 1, color = '#3b82f6', opacity = 1 }: WindArrowProps) { const length = 2.5 * scale; // Tamanho visual fixo - const color = '#3b82f6'; // Azul padrão do vento const targetVec = target instanceof THREE.Vector3 ? target : new THREE.Vector3(...target); const dirVec = direction instanceof THREE.Vector3 ? direction : new THREE.Vector3(...direction); @@ -46,13 +49,13 @@ export function WindArrow({ target, direction, scale = 1 }: WindArrowProps) { {shaftLength > 0 && ( - + )} {/* Ponta da seta (cone) */} - + );