Missions to Mars Urquhart Graph

100%

Missions to Mars Urquhart Graph

✓ Published0🌍 Public

Last edited Jun 7, 2017

Created on Sep 9, 2016

This interactive visualization maps the locations of Mars lander missions on a globe, overlaying a red Urquhart graph derived from the landing sites’ Voronoi diagram. Moving the cursor selects the nearest mission, causing its Voronoi cell to highlight and radiate green lines outward. The globe is rendered via WebGL with a shader for orthographic projection, using a USGS Viking mosaic texture. The graph is computed with `d3.geoVoronoi`, and the mission data comes from Ryan Hodges’ GeoJSON dataset.

AI-generated description

This block demonstrates <a href="https://github.com/Fil/d3-geo-voronoi">d3-geo-voronoi</a>’s <a href="https://en.wikipedia.org/wiki/Urquhart_graph">Urquhart Graph</a> feature, in red.

The geoVoronoi.find(x,y) method is used to select the mission that will ‘radiate’ towards the cursor. (Tiny green lines show the underlying Voronoi tesselation.)

Dataset from <a href="https://github.com/rhodges/hodgimoto/blob/master/app/layers/mars_landings.geojson">Ryan Hodges</a>; image: <a href="http://astrogeology.usgs.gov/search/details/Mars/Viking/MDIM21/Mars_Viking_MDIM21_ClrMosaic_global_232m/cub">USGS</a>.

Uses @mbostock's Milky Way block for the WebGL reprojection shader, <a href="http://bl.ocks.org/Fil/358e889380bfc9d8e4871cc9dc338cf9">adapted for the orthographic projection</a>. License GPL-3.

To do:

-- terminator lighting

mit Licensed

Similar vizzes

Loading thumbnail…

Mars on a WebGL globe

This interactive visualization presents a rotating Mars globe rendered on a canvas using WebGL, with the planet’s surface displayed as a color mosaic from USGS imagery. Users can drag to spin the globe, which is overlaid with white markers, semi-transparent polygons, and red links depicting mission-related paths and regions. The implementation relies on D3 v5, including `d3.geoPath` and its projection tools, to compute the orthographic projection and mouse event handling. A custom WebGL fragment shader performs the inverse projection and pixel blending directly on the GPU, while SVG layers for polygons, links, and mission highlights sit atop the canvas.

PPhilippe Rivière

78% match

Loading thumbnail…

Final Project

This visualization displays the landing sites of successful Mars landers on an interactive globe, projected using an orthographic projection with overlaid SVG markers. The map supports drag-to-rotate and scroll-to-zoom interactions, with tooltips showing each site’s name on hover. It renders the rotating globe’s shaded surface via Canvas and the site markers as SVG paths using `d3.geoPath`, while `d3.drag` and `d3.zoom` handle the gestures. The underlying GeoJSON data for landing coordinates comes from a remote JSON file, and the orthographic rotation uses the Versor library.

Aaniosindustries

72% match

Loading thumbnail…

Urquhart graph of container ports

This map displays the largest container ports worldwide on a Bertin projection, with their Urquhart graph computed by `d3.geoVoronoi` and rendered as red geodesics. It shows how the network connects ports without regard for continental boundaries, as the dataset contains only port coordinates. The visualization uses `d3.geoPath` to draw countries, Voronoi polygons, and links in an SVG, with hover interactions revealing port names via polygon opacity changes.

PPhilippe Rivière

68% match

Loading thumbnail…

Urquhart graph

This visualization demonstrates the Urquhart graph, a subset of the Delaunay triangulation, applied to 2,000 randomly generated points. The graph edges are drawn in red over the Voronoi diagram’s gray polygon boundaries. The code uses `d3.voronoi` to compute the Voronoi cells, links, and triangles, then removes the longest edge from each triangle to derive the Urquhart graph. Sites are rendered as black-stroked circles, with SVG paths and lines for the polygons and edges.

PPhilippe Rivière

68% match

Loading thumbnail…

Mountains on a Map

A world map displays space missions as circles, with radius encoding the number of missions per city and color representing the country, overlaid on a Natural Earth projection. Using d3.geoPath for land, graticules, and sphere rendering, the visualization employs d3.scaleSqrt for circle sizing and React for component structure. The data comes from a CSV of space mission coordinates, with country boundaries from World Atlas TopoJSON, styled with muted fills and opacity for overlapping points.

Nnaisargidave

66% match

Loading thumbnail…

Country wise Space Missions with Brushing

This visualization combines a world map with a time-series histogram to explore space missions by country. A natural Earth projection renders country boundaries and graticules, while semi-transparent circles sized by mission count mark each country. Users can brush along the histogram’s time axis to filter the map, updating the displayed circles interactively. The example uses d3.geoNaturalEarth1, d3.geoPath, d3.brushX, and d3.bin, with data from a Kaggle-hosted CSV and country shapes from World Atlas TopoJSON.

Nnaisargidave

64% match

Loading thumbnail…

geoVoronoi Delaunay links and Urquhart graph

One hundred random points on a sphere generate a geospatial Voronoi diagram, with Delaunay links drawn as white lines and the Urquhart graph subset emphasized in bold. The d3-geo-voronoi library computes the tessellation, while d3.geoPath and an orthographic projection render the polygons and links to SVG. Sites appear as open circles. The legend notes the graph distinction.

PPhilippe Rivière

63% match

Loading thumbnail…

All Space Missions from 1957

This visualization displays all space missions since 1957 as a scatterplot, with each point representing a single rocket launch. The x-axis encodes the mission date (Datum) while the y-axis lists the company name. The plot is rendered using the Vega-Lite API, which is registered with the Vega and Vega-Lite libraries. The code loads CSV data from a GitHub gist via `d3.csv`, and the chart is configured with a custom dark color scheme, no axis domain lines, and a responsive auto-fit size. Tooltips are enabled through the Vega-Tooltip handler.

Ggeorgeeeee

63% match