Customize flight trail colors based on altitude #4
Description
Goal
Make flight trails display different colors based on the aircraft's altitude, creating a more informative visualization.
Background
Currently, flight trails are a single color. Color-coding by altitude would help users quickly identify high-altitude vs. low-altitude flights and make the visualization more engaging.
What needs to be done
- Create a color gradient function based on altitude
- Modify FlightTrajectory component to use altitude-based colors
- Consider adding a legend or indicator
Relevant files
- client/src/components/FlightTrajectory.tsx - Trail rendering component
Suggested color scheme
| Altitude | Color | Hex |
|---|---|---|
| < 3,000 ft (landing/takeoff) | Green | #22c55e |
| 3,000 - 15,000 ft (climbing/descending) | Yellow | #eab308 |
| 15,000 - 30,000 ft (mid-altitude) | Orange | #f97316 |
| > 30,000 ft (cruising) | Red | #ef4444 |
Acceptance criteria
- Trail colors change based on altitude
- Color transitions are smooth (optional: gradient along trail)
- Colors are visible against the map/terrain
- Works in both 3D map and VR modes