Skip to main content
SimilarExport ZIP
100%

Fork of Spinning Globe

✓ Published0🌍 Public
Ool.ritter@web.de
Last edited Feb 22, 2024
Created on Feb 22, 2024
Forked from 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.

AI-generated description

A spinning globe!

See also:

MIT Licensed

Similar vizzes

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 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
93% 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
93% match
Loading thumbnail…

Spinning Globe

A spinning globe rendered with an orthographic projection, showing country boundaries from the visionscarto World Atlas TopoJSON dataset. The view rotates continuously around its vertical axis using `requestAnimationFrame` to incrementally adjust `projection.rotate`. Built with `d3.geoOrthographic`, `d3.geoPath`, and `d3.geoGraticule`, the animation highlights the graticule lines, country outlines, and a bold sphere outline as the Earth turns.

CCurran Kelleher
91% match
Loading thumbnail…

Spinning Globe

A dark globe rendered with an orthographic projection spins continuously, its country borders drawn in red against a black background. The animation updates the projection’s rotation each frame via `requestAnimationFrame`. Built with D3 v7, it uses `geoOrthographic`, `geoPath`, and `geoGraticule` to draw the sphere and graticule, while country outlines come from the `visionscarto-world-atlas` TopoJSON dataset processed with `topojson-client`.

LLauren
89% match
Loading thumbnail…

Spinning Globe

A world map spins continuously to show all continents and the graticule grid, rendered as an orthographic projection that creates the illusion of a rotating globe. The code uses `d3.geoOrthographic`, `d3.geoPath`, and `d3.geoGraticule` to draw the sphere outline, graticule, and country borders, with data loaded from the visionscarto world-atlas TopoJSON file via `topojson-client`. Animation is driven by `requestAnimationFrame` in React, updating the projection’s rotation array each frame.

Sstchiang
88% match
Loading thumbnail…

Spinning Globe

A spinning globe displays the world’s landmasses in an orthographic projection, rotating continuously while its tilt oscillates. The visualization uses D3 v4’s `d3.geoOrthographic()` projection and `d3.geoPath()` to render country polygons from the `world-110m` TopoJSON dataset. A timer updates the projection’s rotation and tilt, redrawing the SVG path each frame to create the animated effect.

CCurran Kelleher
88% match
Loading thumbnail…

spinning_globe_NH

A spinning orthographic globe displays world countries as filled paths, rotating smoothly around a tilted axis. The visualization uses d3-geo’s `geoOrthographic` projection, `geoPath`, and `geoGraticule` to render landmasses and grid lines. Country boundaries come from the visionscarto-world-atlas TopoJSON dataset, fetched via `fetch` and converted with `topojson-client`. The animation is driven by React state updates, with rotation angles changing each frame via `requestAnimationFrame`, redrawing the map on every render.

NNavak94
87% match