Skip to main content
SimilarExport ZIP
100%

Fork of Spinning Globe

✓ Published0🌍 Public
Ss_cural@coloradocollege.edu
Last edited May 5, 2024
Created on May 5, 2024
Forked from Spinning Globe

A spinning globe animation uses an orthographic projection to display world country boundaries from a TopoJSON dataset loaded from unpkg. The d3-geo projection rotates continuously via requestAnimationFrame, updating the globe’s rotation state each frame. A graticule and sphere outline are drawn using d3.geoPath, while country polygons are rendered with distinct strokes, creating a clear, animated visualization of Earth’s geography.

AI-generated description

A spinning globe!

See also:

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Spinning Globe

A spinning orthographic globe displays country boundaries from the visionscarto-world-atlas TopoJSON dataset, with a graticule and sphere outline. Using `d3.geoOrthographic` and `d3.geoPath`, the projection rotates continuously via state updates, reducing the longitude by 0.2 degrees per frame. The animation is driven by `requestAnimationFrame` calls within a reactive state management system, while `topojson-client` converts the TopoJSON features for rendering.

Ool.ritter@web.de
95% match
Loading thumbnail…

Fork of Spinning Globe 1

This animated visualization shows a spinning orthographic globe with country boundaries and a graticule grid, rotating continuously around its vertical axis. The map renders world geography from a TopoJSON dataset fetched from unpkg.com, using D3’s `geoOrthographic`, `geoPath`, and `geoGraticule` to project and draw the sphere, outline, and countries. Animation is driven by `requestAnimationFrame`, updating the rotation state to decrement the longitude each frame, which re-renders the projection. The code manages state transitions and cleanup for hot reloading.

Jjeetamakhal@gmail.com
95% match
Loading thumbnail…

Fork of Spinning Globe

This example presents a spinning globe, rendered as an orthographic projection that continuously rotates to showcase Earth's geography. The visualization uses d3-geo's `geoOrthographic` projection and `geoPath` to draw country outlines from TopoJSON data loaded from the visionscarto-world-atlas, along with a graticule and sphere outline. An animation is driven by `requestAnimationFrame`, which updates the projection's rotation state to create the spinning effect. The code is structured with a main module handling data fetching and state management, while a separate map module draws the geographic elements.

Ool.ritter@web.de
94% match
Loading thumbnail…

Fork of Spinning Globe

This example shows a continuously spinning orthographic globe, with country borders rendered as white outlines against a graticule grid and a sphere outline. The rotation updates its longitude coordinate in each animation frame via `requestAnimationFrame`, while the map is drawn using `d3.geoOrthographic`, `d3.geoPath`, and `d3.geoGraticule`. Geographic data comes from a TopoJSON world atlas fetched at runtime, processed with `topojson-client`.

NNita
94% match
Loading thumbnail…

Fork of Spinning Globe

This example shows a spinning orthographic globe with country boundaries and a graticule grid, rotating smoothly around its vertical axis with a fixed tilt. The animation updates the globe’s rotation state on each frame using `requestAnimationFrame`, and the map is rendered with `d3.geoOrthographic` and `d3.geoPath`. Country shapes come from TopoJSON data fetched from a world atlas, while a sphere outline and graticule are drawn using `d3.geoGraticule`. The code demonstrates incremental rotation updates and cleanup of animation frames.

AAaron Wong
93% match
Loading thumbnail…

Fork of Fork of Spinning Globe

This example shows an animated orthographic projection of the world, with countries rendered as filled paths and a graticule overlay, all rotating in three dimensions. The animation is driven by `projection.rotate` from `d3.geo`, adjusting the view based on state changes. It uses `d3.geoPath` to project the map, `d3.geoGraticule` for the grid, and fetches country boundaries from the `visionscarto-world-atlas` as TopoJSON, which is converted to features via `topojson-client`. The rotation is updated each frame using `requestAnimationFrame` to create a spinning globe effect.

Ool.ritter@web.de
92% match
Loading thumbnail…

Fork of Spinning Globe

This example presents a continuously rotating orthographic projection of the world, with country boundaries rendered in white over a graticule. The sphere tilts at a fixed -20 degree latitude while spinning on its y-axis using `requestAnimationFrame`. The visualization relies on `d3.geoOrthographic`, `d3.geoPath`, and `d3.geoGraticule` to project and draw the map, fetching country data from a visionscarto TopoJSON atlas via `topojson-client`. A black outline is drawn using a `Sphere` geometry path.

SSeekerzero
92% match
Loading thumbnail…

Spinning Globe

A spinning globe uses an orthographic projection to display world country boundaries from a TopoJSON file. The globe rotates continuously around its vertical axis as the projection’s rotation state updates on each animation frame via `requestAnimationFrame`. The code applies `d3.geoOrthographic`, `d3.geoPath`, and `d3.geoGraticule` to draw country paths, a graticule, and a sphere outline, with state managed through setState and cleanup.

JJoel Jäggli
92% match