Planets dataset
This visualization of a solar system dataset combines several D3.js v7 chart types. A bar chart compares planet diameters in kilometers, while a circular layout and a mini planet strip show relative distances from the Sun and planet sizes. The code uses `d3.csv` with `d3.autoType` to load a GitHub Gist dataset, then builds the charts using SVG elements. Custom CSS enhances the design with a radial gradient background and card-based layout. A header starfield with a stylized sun is generated using `d3.range` and random values.
AI-generated descriptionICE-5: The Shapes of Data β Planets of the Solar System
Course: CSCE 5320 Scientific Data Visualization
Objective:
Visualize physical and orbital characteristics of planets in
our solar system using D3.js.
Dataset:
A custom-created CSV file hosted on GitHub Gist β includes
columns:
- planet
- distance_from_sun_million_km
- diameter_km
- gravity_m_s2
- moons
- orbital_period_days
- color
Visualizations:
- Bar Chart β compares planet diameters in km.
- Circle Layout β shows relative distances from the Sun.
- SVG image Tools Used:
- HTML, CSS, and JavaScript
- D3.js (for data loading and visualization)
- VizHub (for live hosting and sharing)
Author:
Ruthvik Bairaboina β University of North Texas (CSCE 5320)
Comments
Sign in to join the discussion.