Solar_System_Multi_Series_Chart

100%

Solar_System_Multi_Series_Chart

✓ Published0🌍 Public

Last edited Oct 17, 2025

Created on Oct 17, 2025

This example visualizes planet diameters and orbital periods with a combined bar chart and line chart. Purple bars represent each planet’s diameter in kilometers, while a yellow curved line with dots indicates orbital period in days. The visualization is built with D3 v7 using SVG rendering, and it loads planetary data from a remote CSV file. It uses `d3.scaleBand` for the categorical x-axis, `d3.scaleLinear` for the y-axes, and `d3.line` with `d3.curveMonotoneX` to draw the line.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Solar_System_Multi_Series_Chart

This mixed-series chart compares planetary diameter (bar) and orbital period (line) for 15 objects. A dual-axis layout uses a left scale for diameter and a right scale for orbital days, with the line positioned at bar centers. Built with D3 v7, it loads CSV data via `d3.csv`, applies `d3.scaleBand` and `d3.scaleLinear`, and renders SVG bars, a `d3.line` with `curveMonotoneX`, and circles. A legend distinguishes the metrics.

AALIMINETI SPOORTHY REDDY

91% match

Loading thumbnail…

Solar_System_Bar_Graph

This visualization shows the diameters of planets in kilometers using a bar chart, with each bar colored distinctly and a corresponding legend. The data is loaded from a CSV file via `d3.csv`, parsed, and sliced to the first 12 entries. The bars are rendered as SVG rectangles using `d3.scaleBand` for the x-axis and `d3.scaleLinear` for the y-axis, with colors assigned via `d3.scaleOrdinal` and `d3.schemeCategory10`. Both axes are labeled, and axis ticks are rotated for readability.

AALIMINETI SPOORTHY REDDY

86% match

Loading thumbnail…

Solar_System_Bar_Graph

A bar chart displays the diameters of planets in the solar system, sourced from a CSV dataset hosted in a GitHub gist. The chart uses D3.v7 to map planet names along the x-axis and diameter values on the y-axis, with bars colored by planet type and tooltips revealing additional attributes like type and moon count. The static, SVG-based visualization is rendered without animation, featuring a clean, bordered bar style, axis labels, and a legend.

AALIMINETI SPOORTHY REDDY

84% match

Loading thumbnail…

Solar_System_Scatter_Plot

This scatter plot displays the relationship between the orbital period and diameter of planets, with each point colored by its base planet name and accompanied by a legend. The visualization uses D3 v7 to load CSV data, apply linear scales, render SVG axes and circles, and generate an ordinal color scale with a category palette. The data is sourced from a GitHub gist containing planetary measurements.

AALIMINETI SPOORTHY REDDY

83% match

Loading thumbnail…

SolarSystem_BarGraph

This scatter plot visualizes the diameters of planets and moons, with each dot colored by its base planet and labeled with emoji icons. The chart uses a D3.js v7 SVG rendering, with a band scale on the x-axis for categorical names and a linear scale on the y-axis for diameter in kilometers. Data is loaded from a CSV file hosted on GitHub, and tooltips provide details on type, diameter, and moon count for each celestial body.

AALIMINETI SPOORTHY REDDY

83% match

Loading thumbnail…

D3 Barchart

This example visualizes the diameters of planets in our solar system using a horizontal bar chart built with D3.js. The bars are rendered as SVG rectangles, scaled using `d3.scaleLinear` for the x-axis and `d3.scaleBand` for the categorical y-axis, which lists planet names sorted in descending order by diameter. The chart imports data from `planets.csv`, converts the diameter strings to numbers, and displays axes generated with `d3.axisLeft` and `d3.axisBottom`. The SVG canvas is 960 by 500 pixels, with margins applied via a group transformation.

Ddabrze3@gmail.com

81% match

Loading thumbnail…

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.

RRuthvik Bairaboina

80% match

Loading thumbnail…

DV Group 1

This chart shows the diameters of the planets in our solar system as a horizontal bar chart, using data loaded from a CSV file. The bars are drawn as SVG rectangles, with a linear scale for the diameter values and a band scale for the planet names, sorted in descending order. The visualization is built with D3 v6, using `d3.csv` to load the data and `d3.axisBottom` and `d3.axisLeft` for the axes. The chart is rendered into an SVG element within an HTML page.

Ddabrze3@gmail.com

79% match