Globe Viewer - Visualize the globe using WebGL
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.
app update about us URL Jul 2, 2018
script remove commented line from make-vectors script Jul 2, 2018
.gitignore Continue update of packages and switch to webpack Apr 19, 2018
LICENSE add license Jul 9, 2016
demo.jpg add demo image Jul 9, 2016
package.json Update links to point to visualperspective URL Jul 2, 2018
webpack.common.js create dev and prod webpack builds Jul 2, 2018 create dev and prod webpack builds Jul 2, 2018
yarn.lock create dev and prod webpack builds Jul 2, 2018

Globe Viewer

Globe Viewer Example

Renders the globe in different ways using WebGL (Live Demo). Uses fixed data sources for now, though this is meant as a base for visualizations that add other data sets.

Installing and Running


  • a recent version of nodejs and yarn
  • topojson (yarn global add topojson)
  • ImageMagick

To install, clone the repo and download and prepare the data (this may take a few minutes):

yarn install
yarn make-vectors
yarn process-images

To run:

yarn start

The viewer should now be available at http://localhost:3333

Data Sources

Land color (app/assets/data/color-*)

Natural Earth Cross Blended Hypsometry

Topography and bathymetry (app/assets/data/topo-bathy-*)

Blue Marble

Night Sky Lights (app/assets/data/lights-*)

Blue Marble

Land, Ocean, Rivers, and Borders (app/assets/data/vectors.json)

Natural Earth Physical Vectors

These physical vectors can be downloaded and processed using ./scripts/ The resulting json is then drawn to an offscreen canvas in the browser using vectorLayer.js

Other Globe Visualizations / Platforms on the Web