Skip to main content
SimilarExport ZIP
100%

satellite projection w graticule

✓ Published0🌍 Public
LLuisSevillano
Last edited May 20, 2016
Created on May 20, 2016

This interactive visualization projects a view of Earth from a satellite, centered on Europe and North Africa, with a graticule grid overlaid. It uses `d3.geo.satellite()` to define the projection and renders map data onto a canvas via the StaticCanvasMap. The map displays Natural Earth coastline, Spanish provinces, and urban areas as separate layers, painting features dynamically with the spam library. A marker and label for Madrid are also projected and drawn on the map.

AI-generated description

Inspired by Mike Bostock's satellite projection. This time with graticule and new spam syntaxis (static, dynamic) for each feature. Urban areas and coastline data by naturalearthdata

mit Licensed

Similar vizzes

Loading thumbnail…

satellite projection

A satellite projection shows Earth as seen from an orbiting spacecraft, with the Iberian Peninsula centered on a curved horizon. The map layers Spanish coastline, provincial boundaries, and urban areas, rendered with a soft glow and a highlighted marker for Madrid. Built with D3.js and the `d3.geo.satellite` projection, the visualization uses canvas-based rendering for efficient drawing. Geographic data comes from Natural Earth, processed with TopoJSON, while a spatial index (RBush) accelerates feature lookup during rendering.

LLuisSevillano
88% match
Loading thumbnail…

line between points w satellite projection

A satellite projection renders the Earth from an angled, tilted viewpoint, with graticule lines, country borders, and urban areas drawn from Natural Earth data via TopoJSON. A dashed red quadratic curve connects projected city markers for Paris and Rome, both plotted as points over the map. The visualization uses D3.js and the d3.geo.satellite projection from the d3-geo-projection plugin, with features painted onto a continuously rendered canvas.

LLuisSevillano
80% match
Loading thumbnail…

Satellite Projection

This example shows a satellite projection of the United States, with a graticule overlay and land boundaries rendered as SVG paths. The projection is created with `d3.geo.satellite()`, configured with a distance, scale, rotation, center, and tilt to simulate a view from space. The graticule is generated using `d3.geo.graticule()` and the map data is loaded from an external JSON file via `d3.json`. The code uses `d3.geo.path()` with the projection to draw both the graticule and the land polygons, which are converted from TopoJSON using `topojson.feature()`.

Mmbostock
79% match
Loading thumbnail…

Satellite

This visualization shows a rotating globe with a graticule and sphere outline from the perspective of a satellite orbiting Earth. The animation continuously adjusts the camera tilt and rotation, creating a dynamic view of the planet’s surface. It uses the D3.js graphics pipeline with `d3.geo.satellite` for projection, `d3.geo.clipCircle` for visibility clipping, and the Canvas API for rendering. The data source is a graticule and sphere generated on the fly, with real-time animation driven by a timer and elapsed time.

Mmbostock
78% match
Loading thumbnail…

Gist 7db080b8909bfe2d732eeb33909de6ec

This visualization combines a D3 geographic projection with an animated particle system on an SVG and canvas hybrid, showing graticules and a world map in an interrupted sinusoidal projection. The code references the idea of piling up continents by latitude and longitude, and uses d3-geo-projection to render the map with an unusual projection. The animation likely shows the map morphing or the graticules/particles being drawn dynamically.

11wheel
75% match
Loading thumbnail…

Satellite Projection Test

A tilted perspective satellite projection of the eastern seaboard, viewed from above Newburg, N.Y., overlays a red 1° graticule on a scanned reference map. The code uses d3.geo.satellite() with custom distance, rotation, and tilt parameters, and manually offsets the projection to align the graticule with the map image. It renders the graticule as an SVG path via d3.geo.path(), using d3.geo.graticule() to define the extent. The background image is loaded from a local readme.png file, and the graticule is clipped to a small area around the reference coordinates.

Mmbostock
74% match
Loading thumbnail…

d3-composite-projections test

This example demonstrates an interactive map of Spain’s autonomous regions using the d3-composite-projections library to combine separate projections into a single visualization. It loads preprojected TopoJSON data from the es-atlas package and renders boundaries with `d3.geoPath`, while a dashed brown overlay marks the composite projection’s internal borders. As the user moves the mouse, the code uses `projection.invert` to display geographic coordinates and appends fading circles at each cursor position, using SVG transitions to shrink them. Points outside the valid projection area trigger an error message instead of drawing.

LLuisSevillano
74% match
Loading thumbnail…

Satellite Projection Hebrides

A satellite projection of the Hebrides islands displays land, rivers, and lakes in muted greens and blues, rotating slowly to simulate an orbital view. The map redraws its geographic features as the mouse moves, adjusting latitude and longitude to follow the cursor. Built with D3.js and the d3-geo-projection library, it uses `d3.geoSatellite`, `d3.geoPath`, and TopoJSON data for vectors. The visualization updates paths dynamically, rendering SVG shapes with animation when idle.

PPhilippe Rivière
74% match