Skip to content

Latest commit

 

History

History
78 lines (56 loc) · 4.33 KB

README.md

File metadata and controls

78 lines (56 loc) · 4.33 KB

Flight Tracker

Started September 09, 2020

Published September 18, 2020

https://mannylopez.github.io/flightTracker/

3D altitude map for current flights anywhere in the world

2020.09.18-altitude

Got the idea to build a real-time flight tracker from Geodose's Build Your Own Flight Tracking Application with Python and Open Air Traffic Data post. The tutorial is built using Python, and I'm going to try to do it in JavaScript.

Resources

To do

  • Create an array of objects by combining the keys and values from Opensky network REST response
  • Place markers on map for each airplane
  • Add plane marker with plane facing direction of travel
  • Add flight card with flight info when airplane is clicked
  • Add plane trajectory
  • Refresh flights automatically
  • Add OpenSky attribution to page
  • Design and add flight card with metadata

Log

September 10, 2020

  1. Created structured data from the Opensky API response and then used that data to
  2. Add markers to the map using the object's latitude and longitude Add markers

September 11, 2020

  1. Add plane marker with plane facing direction of travel
  2. Add flight card with flight info when airplane is clicked
  3. Notes:

Flight markers

September 13, 2020

Blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present. The endpoints are not publicly available. Dang. Learnt more about CORS and why I can get results from those endpoints using Postman and my terminal, but not when using the browser.

September 14, 2020

Explored OpenSky's /aircraft endpoint and figured out that it does not return current flights. It returns data for flights that have started and ended. I need to find another API to get the current departure and arrival airport for any given flight.

September 15, 2020

I'm going to pause trying to get realtime data for a flight in progress. The API I found, aviationstack, provides a free tier for personal projects, but I would be exposing my private API key since my app is all frontend. I need to learn about servers and making the call in the backend. I'll come back to this once I learn how to work with servers.

September 17, 2020

Pivot! Since I can't get departure and arrival information for free, I'm going to work with the data I do have.

The map now shows 3D points representing the altitude of the plane. The layers are all generated from the GeoJSON file I create on the fly after receiving the data from the API call.

2020.09.16-altitude

September 18, 2020

Finished product!

Map on load 2020.09.18-points

After "Altitude" button is pressed 2020.09.18-altitude

Pushing this to https://mannylopez.github.io/flightTracker/