Skip to main content
SimilarExport ZIP
100%

Rotating Globe

✓ Published0🌍 Public
Nnouralkhoury
Last edited Nov 28, 2020
Created on Nov 28, 2020
Forked from Rotating Globe

A rotating orthographic globe displays world landmasses and graticule meridians in SVG. The Earth spins continuously via a d3.timer that updates the d3.geoOrthographic projection’s rotation, with d3.geoPath rendering the geographic features from TopoJSON world-atlas data. A hover effect darkens countries, while a static color legend lists continents. Zoom and pan are supported through d3.zoom, with the globe group transformed on user input.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Rotating Globe

This example shows a continuously rotating orthographic globe, with country outlines and a graticule drawn over a dark ocean. The globe is interactive, allowing users to pan and zoom via a d3.zoom handler that applies a transform to the SVG group. The rotation is driven by a d3.timer that updates the d3.geoOrthographic projection’s rotation, while d3.geoPath renders the sphere, graticule, and land masses from World Atlas TopoJSON and TSV data. The visualization uses SVG with hover highlights on countries.

Ddarinadii11
93% match
Loading thumbnail…

Rotating Globe

A rotating orthographic globe displays country boundaries and graticules, with land masses that change color on hover. The visualization uses D3 v5’s `geoOrthographic`, `geoPath`, and `geoGraticule` with a timer to continuously adjust the projection rotation. World map data comes from the World Atlas TopoJSON, while country names are loaded from a TSV file. Zooming is enabled via D3’s `zoom` behavior, and all rendering uses SVG paths.

Zzahra929
92% match
Loading thumbnail…

Rotating Globe

A rotating orthographic globe displays country-level data values, with landmasses rendered in sky blue and hover states highlighted in dark blue. Using D3 v5 with `d3.geoOrthographic` and `d3.geoPath`, the projection rotates continuously via `d3.timer`, while a graticule overlays the sphere. The visualization loads world topology from TopoJSON and country names from a CSV file, with zoom support via `d3.zoom`.

Nnouralkhoury
91% match
Loading thumbnail…

Rotating Globe

A rotating orthographic globe displays Earth's landmasses in sky blue against a black background, with graticule lines and interactive country names on hover. The rotation is driven by a `d3.timer` that continuously updates the projection's rotation angles, while `d3.geoOrthographic` and `d3.geoPath` render the sphere and features. World map data comes from the `world-atlas` package, loaded via `d3.json` and `d3.tsv`, with country names built into a lookup table. The visualization uses SVG for rendering within a `d3` framework.

AAbhishekJha1994Outlook
91% match
Loading thumbnail…

D3 Course 7: World Map - Rotating Globe

This interactive visualization presents a rotating orthographic globe that continually spins on a tilted axis. The world’s landmasses, drawn in light green with dark borders, are accompanied by a graticule grid of meridians and parallels. The globe supports zooming via the d3.zoom behavior, while d3.timer drives the rotation by updating the d3.geoOrthographic projection’s rotation parameters. Country data comes from the world-atlas TopoJSON files, with names appended as SVG title tooltips; hovering highlights individual countries in red.

Zzahra929
89% match
Loading thumbnail…

D3 Course 7: World Map - Rotating Globe

This example demonstrates an interactive orthographic globe that rotates continuously, with countries rendered in light green and highlighted red on hover. The visualization shows land masses, a graticule grid, and an ocean sphere against a black background, with zooming enabled. It uses D3 v5 and TopoJSON, applying d3.geoOrthographic and d3.geoPath to project world data from the world-atlas 50m dataset. A d3.timer drives the rotation by updating the projection’s rotation, while zoom behavior transforms the globe group. Country names are displayed via SVG title elements.

Zzahra929
88% match
Loading thumbnail…

D3 Course 7: World Map - Rotating Globe

This example shows a rotating orthographic globe, with land masses rendered in light green against a black background. Country names appear as hover tooltips. The globe rotates continuously based on an elapsed time timer, with the projection's rotation updated accordingly. D3's `geoOrthographic` projection, `geoPath`, and `geoGraticule` are used to define the map, while land data comes from the `world-atlas` package. The visualization uses SVG rendering and a zoom interaction, and displays a graticule overlay.

Nnouralkhoury
87% match
Loading thumbnail…

Rotating globe

This rotating globe visualization uses an orthographic projection to display world country polygons, a graticule grid, and three labeled city points (Munich, San Antonio, and Melbourne). The globe continuously rotates via a d3.timer, updating the country paths, graticule lines, city markers, and labels each frame. Labels are hidden when their corresponding city is on the far side of the globe, determined by the great-arc distance from the map’s center. The example uses d3.v3 with SVG and animation, loading TopoJSON world data and styling countries, graticules, and points with distinct colors.

EEE2dev
87% match