Skip to main content
SimilarExport ZIP
100%

Space Stations

✓ Published1🌍 Public
Nnadia-el
Last edited Mar 18, 2020
Created on Mar 18, 2020

Space Stations visualizes orbital data for satellites through an interactive parallel coordinates plot. The D3.js visualization maps each satellite's trajectory across multiple dimensions including inclination, eccentricity, and mean motion, with brushed axes allowing users to filter data ranges. The example parses two-line element (TLE) set data from a text file into structured CSV format, then renders the multidimensional relationships using d3.svg.brush and custom SVG paths with color-coded strokes for each orbital object.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Space Stations

This visualization uses a parallel coordinates chart to explore patterns in mining accident data, displaying multiple dimensions such as nature of injury, classification, injury source, body part, mining equipment, occupation, and accident dates. The d3.svg.axis and d3.scale.ordinal functions render the vertical axes, while d3.svg.line draws each accident as a connected polyline. Data is loaded from a pipe-delimited text file and coerced into numbers, strings, and dates. Brushing interactions on each axis allow users to filter the displayed records interactively.

Nnadia-el
73% match
Loading thumbnail…

Space Stations_QN

This parallel coordinates chart displays the attributes of subsea control module (SCM) notifications, with each axis representing a categorical field such as notification type, priority, origin, cause, damage description, material, and defect date. Each polyline traces a single record through the dimensions, revealing patterns and correlations across these variables. The visualization is built with D3.js (v3 and v5), using SVG for rendering and custom axes with brushes for interactive filtering. The data is loaded from a pipe-delimited text file containing 19 records of inspection and defect reports.

Nnadia-el
72% match
Loading thumbnail…

d3 | Parallel Coordinates

This example shows a parallel coordinates plot of planetary data from NASA, displaying each planet’s day length, distance from the Sun, orbital period, mass, and diameter as linked polylines across vertical axes. Users can brush along any axis to filter the highlighted lines, and drag axes to reorder them. The visualization uses the d3.parcoords library, built on d3.v3, with SVG for axes and canvas layers for rendering shadow, foreground, and highlight strokes, plus animation during drag transitions.

GGoomble
70% match
Loading thumbnail…

ScatterPlot

This animated scatter plot visualizes planetary data, showing each planet’s diameter, number of moons, and orbital period as a colored, sized circle on a dark, space-themed SVG canvas. The planets continuously wander and bounce off the plot’s edges using a `d3.timer` loop that updates circle positions. Hovering reveals a tooltip with details like discovery date, while a legend groups planets by type. The code loads a CSV dataset, applies linear scales for axes and a sqrt scale for size, and uses `d3.axisBottom` and `d3.axisLeft`.

AALIMINETI SPOORTHY REDDY
68% match
Loading thumbnail…

Solar System Orbits (Fork of Fork of HTML Starter)

This interactive HTML visualization presents the solar system with animated planet orbits around a central sun. Users click a planet to reveal two additional data views: a line chart showing distance from the sun versus average temperature, and a pie chart displaying atmospheric composition percentages for that planet. The orbit diagram uses SVG paths with animated motion along circular trajectories, while the charts are generated programmatically. The line charts employ D3's scaleLinear for axes and a monotone curve line, while the pie charts use the d3.pie layout algorithm with d3.arc for rendering sectors.

JJonas
68% match
Loading thumbnail…

Orbits 3

A scrolling narrative pairs text sections with a fixed orbital node-link diagram built with D3.js. As the user scrolls, the active text section highlights while the graph animates between hierarchical layouts using the `d3.layout.orbit` plugin. The SVG visualization renders categories from a JSON file, colored via `d3.scale.category20b`, and uses the `graph-scroll.js` library to synchronize scrolling with the chart’s state changes.

MMraleksa
67% match
Loading thumbnail…

Linking to Data Table

A parallel coordinates chart displays planetary attributes—day length, distance from the Sun, orbital period, mass, and diameter—from NASA fact sheet data. The visualization uses the `d3.parcoords` library with SVG axes and canvas-rendered lines, colored by day length via a linear scale. Brushing filters the data, updating an accompanying data table built with `d3.divgrid`. Hovering over table rows highlights corresponding lines in the chart.

GGoomble
67% 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
67% match