feat: Implement 3D Radar View Controls - resolves #9
- Add Reset View button functionality to reset camera to default position - Implement Auto Rotate toggle with visual feedback and button text updates - Add Range slider (10-500km) with real-time aircraft distance filtering - Use server-provided origin coordinates via /api/origin API endpoint - Implement Haversine formula for accurate geographic distance calculations - Add deferred initialization to prevent black screen issue - Enhanced lighting and ground plane visibility for better 3D orientation - Add comprehensive debugging and error handling for WebGL/Three.js - Style 3D radar controls with proper CSS for consistent UI - Remove construction notice as controls are now fully functional 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
parent
4c9215b535
commit
a2cf9d8fdb
3 changed files with 352 additions and 44 deletions
|
|
@ -857,4 +857,60 @@ body {
|
|||
|
||||
.squawk-standard:hover {
|
||||
background: #218838;
|
||||
}
|
||||
|
||||
/* 3D Radar Styles */
|
||||
#radar3d-view {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#radar3d-container {
|
||||
flex: 1;
|
||||
min-height: 500px;
|
||||
width: 100%;
|
||||
background: #0a0a0a;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.radar3d-controls {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
padding: 1rem;
|
||||
background: #2d2d2d;
|
||||
border-bottom: 1px solid #404040;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.radar3d-controls button {
|
||||
padding: 0.5rem 1rem;
|
||||
background: #404040;
|
||||
color: white;
|
||||
border: 1px solid #666;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.radar3d-controls button:hover:not(:disabled) {
|
||||
background: #505050;
|
||||
}
|
||||
|
||||
.radar3d-controls button:disabled {
|
||||
opacity: 0.5;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.radar3d-controls button.active {
|
||||
background: #00a8ff;
|
||||
border-color: #0088cc;
|
||||
}
|
||||
|
||||
.radar3d-controls label {
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
align-items: center;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.radar3d-controls input[type="range"] {
|
||||
width: 150px;
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue