Introduction
I’ve always been fascinated by aviation. Living near Brisbane Airport (YBBN), I wanted a way to visualize the traffic patterns in my backyard that went beyond a simple 2D map. This led to the creation of BNE AeroTracker Ultimate—a hybrid web application that combines live flight data with a fully interactive 3D environment.
The Architecture
AeroTracker is built on a heavy-duty stack designed for high-performance spatial data: - ArcGIS Maps SDK for JavaScript: Handles the complex 3D rendering, terrain elevation, and coordinate projections. - Tailwind CSS: Provides the sleek, "glassmorphism" UI for the control panels. - AviationStack API: Streams real-time data for commercial flights arriving and departing from BNE.
Key Feature: The Dual-View Engine
One of the most challenging parts of this project was implementing two completely different visualization modes that share the same data state.
1. The Tactical 3D Scene
Using SceneView, I rendered Brisbane's airspace with extruded "volumes" to represent controlled sectors. Every aircraft is represented by a 3D primitive that updates its heading, bank, and pitch in real-time. I added what I call "Tron Trails"—dynamic 3D paths that show the history of a flight's trajectory.
2. The ATC Radar (Canvas)
For a more "retro-tech" feel, I built a custom ATC Radar using the HTML5 Canvas API. It features: - Real-time sweep animation. - Vector Prediction: A line extending from the aircraft blip showing where it will be in 60 seconds. - Range Rings: Concentric circles measuring distance in Nautical Miles (NM).
Adding a Simulator
Why just watch when you can fly? I integrated a Simulator Mode that lets me take control of a virtual Cessna 152. I implemented basic physics and a custom on-screen joystick, allowing for full 3D flight through the live traffic environment.
// A snippet of the player physics logic
player.heading += player.inputs.x * 2.5;
const bank = -player.inputs.x * 45;
const pitch = player.inputs.y * 15;
player.pos.alt += player.inputs.y * 30;
Conclusion
BNE AeroTracker is more than just a map; it’s a spatial experiment. It combines real-world API data with game-like mechanics and professional GIS tools. It has given me a much deeper appreciation for the complexity of Brisbane's controlled airspace. Next up: integrating live ADS-B data from my own local receiver!
Comments