We want a Mars globe in the browser. Similar to this Nasa Mars map.
webGL / three.js / Cesium seem to be the best stack.
Website visitors should be able to
- spin the planet.
- zoom in and out,
When zooming in, load different levels of high res images. For which can use the Nasa API.
When we solved the problems above, we want to build new features:
- 3D Tiles: Use elevation data to show the depth of terrain. Like in (this demo), built in the
threejsbranch (using textures/bump.jpg layer). There are different formats of elevation data. For example: - Show geodata like landing sites, from a a json file like this.
- Click one section - like a square of 100 kilometers - to show a black square line around that same area. Similar to image below.
- Set up our own WMTS map server. Because we don't want to get rate limited by the NASA API, and we want to serve our own images.
- Let user choose between different layers / WMTS map source. Like in this example, where users can choose between a normal Mars map today, and one with water on the lower surface of Mars.
- Mars globe in react three fiber, using react components. (Demo) built from
reactbranch. - Tools for generating map tiles and hosting them: carto.js or TileStache or maptiler or upload image files to Cesium.
- High resolution image tiles, for different layers, from this page.
- (WebGL Earth), from which I built this demo on
earth-webglbranch, using a Mars map from this API.