Nasa Worldwind Fundamentals

100%

Nasa Worldwind Fundamentals

✓ Published0🌍 Public

Last edited Apr 26, 2024

Created on Apr 26, 2024

This interactive visualization showcases a 3D Earth globe with real-world satellite imagery as its base layer, using NASA WorldWind's JavaScript API to render the planet within an HTML5 Canvas. In addition to the global topographic map, the program integrates a collection of star positions and tectonic plate boundaries, which can be overlaid on the globe. To guide the user, a compass and coordinate display are included, along with on-screen controls for panning, zooming, and tilting the view. The visualization leverages the WorldWind library's layer system to combine the Blue Marble Next Generation (BMNG) imagery and Landsat data with the user-provided GeoJSON datasets for stars and plates, all rendered via the Canvas API.

AI-generated description

starter file for nasa world wind with javascript https://worldwind.arc.nasa.gov/web/get-started/#anchor

MIT Licensed

Similar vizzes

Loading thumbnail…

nasa world wind

This example presents an interactive three-dimensional globe using the NASA World Wind API, allowing exploration of Earth through a virtual globe interface. The visualization renders satellite imagery and geographical data directly from NASA's servers, with the globe rotating smoothly in response to user drag and zoom commands. The code implements the World Wind Java-compatible JavaScript library, which handles the complex projection and tile-loading of global imagery layers. Together with the supporting HTML structure, this creates a lightweight, web-based alternative to desktop GIS clients.

DDonald Bagwell

85% match

Loading thumbnail…

Web Worldwind starter

This example shows a NASA Web WorldWind globe rendered on an HTML5 Canvas. It displays a blue extruded polygon, a labeled red placemark, and a WMS layer, with navigation controls and coordinate readouts using the WorldWind API. The code initializes a `WorldWindow`, adds imagery, terrain, and shape layers, and creates a `Placemark` and `Polygon` with custom attributes. A WMS layer pulls data from a NASA service over HTTP, and a `ColladaLoader` can load a 3D model.

DDonald Bagwell

81% match

Loading thumbnail…

rotatable globe

A rotatable globe displays Earth’s continents and oceans, with animated color-coded pings appearing at random latitude and longitude coordinates. The globe auto-rotates around its vertical axis using a custom `autorotate` plugin that updates the projection’s rotation each frame. Built with React, the visualization uses D3 v5’s projection and path APIs, TopoJSON for world-110m-withlakes data, and the Canvas API for rendering. Users can drag to pause rotation and zoom via the Planetary.js-compatible drag and zoom plugins, with support for high-density displays.

CChase Hall

72% match

Loading thumbnail…

Globe with Panning & Zooming

This example presents an interactive orthographic globe that users can pan by dragging and zoom with the scroll wheel. The visualization renders landmasses and internal country borders, projecting the 3D sphere onto a 2D plane using d3.geoOrthographic and d3.geoPath. The globe's rotation and scale are controlled via d3.drag and d3.zoom, with panning sensitivity inversely tied to the current zoom level. World geometry comes from the visionscarto-world-atlas package, processed with topojson-client to extract features and meshes.

SShad Frigui

72% match

Loading thumbnail…

World Tour

This visualization presents an animated orthographic globe that cycles through the world’s countries, highlighting each one in red while rotating to center it on screen. The display shows the country name above the globe as it transitions between nations. The code uses D3.js v3 for transitions and tweens, TopoJSON for world map data, and a Canvas 2D context for rendering. A queue loads GeoJSON topology and country name mappings, while d3.geo.path draws land, borders, and the globe sphere with dynamic rotation.

AAjar06

72% match

Loading thumbnail…

Untitled

This example demonstrates an interactive 3D globe visualization built with React and D3. It renders a rotating Earth using `d3.geoOrthographic` and `d3.geoPath` to project country boundaries onto a canvas, with atmospheric shading applied through layered gradients. The code uses `d3.forceSimulation` to position label nodes around the planet, enabling smooth hover interactions that display country names and associated data. The visualization loads geographic coordinates from a bundled TopoJSON dataset and updates the globe’s rotation via a requestAnimationFrame loop, providing a dynamic and responsive exploration of world geography.

Ssambird1

72% match

Loading thumbnail…

World Map

This interactive world map visualizes global landmasses and country borders using a natural Earth projection. The visualization renders a sphere, graticule grid, land areas in teal, and interior boundaries in a lighter teal stroke. Built with React and D3 v5, it uses the `geoNaturalEarth1` and `geoPath` APIs to project and draw geographic features, while TopoJSON converts the world-atlas dataset into GeoJSON features and meshes. Styling is applied via CSS classes on SVG path elements.

CCees Klap

72% match

Loading thumbnail…

Globe with panning & zooming

This example presents an interactive globe that users can pan and zoom, rendered using a D3 orthographic projection. Landmasses and internal country borders are drawn from the visionscarto-world-atlas TopoJSON dataset via `d3.geoOrthographic` and `geoPath`. The globe responds to drag interactions for rotation and mouse-wheel zoom events, adjusting the projection’s rotation and scale through `d3.drag` and `d3.zoom` handlers. A fitted initial view establishes the default scale, while the sphere, land, and country-mesh features are styled via CSS classes.

SShad Frigui

72% match