AirRoutes-Desert

[ThatDesert]

AirRoutes

I found the visual of flight paths over a map quite interesting, almost like a spider web across the Earth, so I wrote a script that converts a list of routes into line segments that can be plotted with Blot (https://github.com/GameDesert/BlotAirRoutes/blob/main/airports.js). I turned this into an API and called it here in index.js to allow the user to draw any shape or pattern they see fit, using purely a list of airports.

How It Works:

• The user provides a list of routes, providing the IATA Codes (format: XYZ) for the start and end
• Each airport is looked up in a table (provided by openflights.org) to find its global coordinates
• A great circle formula is used to calculate the arc taken by a plane on the route (due to map projections, etc) and 3 points are found along the line
• The point global coordinates are converted to relative ones, as a fraction of the X and Y axis of a given bounding box (in this case, Europe)
• These coordinates are sent back to the drawing script, which then draws each arc using the 5 points provided (1 start, 1 end, 3 midpoint) and a Catmull-Rom function

To change the list of flight routes, the format is:

...,
{"from":"ABC", "to":"XYZ"},
...

Unfortunately, the script for converting the routes to points had to be run separately as an API due to its reliance on libraries and reading from external CSV files. It is also quite resource-intensive so it would be too slow to run in-browser.

All the files used in the creation of this project can be found here: https://github.com/GameDesert/BlotAirRoutes/, but the script in this PR should be able to successfully render the image on its own, given access to the API.

There is a limitation on how many routes can be added before the rendering becomes too slow.

---

• [x] I have read the steps to getting a blot

• [x] I am submitting art that...

  • [x] is algorithmically generated (will change each time the program is run)
  • [x] is drawable on a blot (fits in the work area & doesn't overlap too much)
  • [x] is original (not copied from somewhere else)
  • [x] doesn't call Math.random() (See the documentation on randomness)
  • [x] is drawable on a physical machine (doesn't have lines overlap more than 5 times)

• [ ] Optional, if you used a tutorial or based your art on something else, please include the link here:

• [ ] Optional, if you remixed this from something else, mention it here:

[github-actions[bot]]

art/AirRoutes-Desert/index.js looks like art! preview it in the editor

[qcoral]

This is awesome. Could I get your Slack? I'd love to dm you.

[ThatDesert]

Thanks! It's @Desert on the HackClub Slack.

[Dongathan-Jong]

Just an update, I will be closing this PR. Please create a new PR if you would like to update your art! (I'm not sure as to if Alex accepted this PR or not!) We are doing this due to new management of the PR system.