A couple of months back we had a course in geodesy and where doing some exercises with doing transformations between different coordinate systems. One of the steps in such a conversion is to transform the map lat/lon coordinates into geocentric XYZ coordinates (these can then be transformed into the target coordinate system).
During the exercise I realised that these coordinates could be more than just an intermediate step, you can plot them in 3D-space and get a globe!
I began creating the visualisation in p5js, generating a grid of lat/lng coordinates, applying the gecentric conversion to them and plotting them to see if I could make a basic sphere.
As can already be seen in this very basic example, the frame rate in p5js for 3D stuff isn’t all that great, and it quickly got worse when I introduced more complex geometry. So I started to look around for alternatives and found three.js, which seems to be the standard for doing 3D stuff in the browser and started learning how to use that.
Here’s the final result, from a flat lat/lng coastlines shapefile from Natural Earth, to an interactive (eh, somewhat at least) 3d-globe.
The code for the experiment can be found here