Skip to main content
SimilarExport ZIP
100%

multi series chart

✓ Published2🌍 Public
Kkoppulasudhakar03@gmail.com
Last edited Oct 20, 2025
Created on Oct 19, 2025
Forked from D3 Starter

This multi-series chart displays both the total registered vehicle counts and the corresponding survey years for ten countries. Animated blue bars represent vehicle registrations on the left axis, while a red Catmull-Rom smoothed line overlays the year on the right axis. The visualization uses D3 v7 with SVG, featuring a staggered drawing effect via stroke-dashoffset. Data is loaded from a CSV file, with gridlines and dual axes aiding comparison.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

multi series chart_Maneesh

This multi-series chart displays global registered vehicle counts by country as animated blue bars, while a red line with a Catmull-Rom curve shows the corresponding registration year on a secondary axis. Built with React and D3 v7, the visualization loads data from a CSV file and renders to SVG. Bars grow upward via `transition().duration()`, and the line draws itself using `stroke-dasharray` and `stroke-dashoffset` animation.

MManeesh Kumar
88% match
Loading thumbnail…

scatter plot

This scatter plot shows the number of registered vehicles for ten countries versus their reporting year. Each circle represents a country, with hover interactions revealing the specific country name, vehicle count, and year. The visualization uses D3 v7’s `scaleLinear` for both axes, `d3.extent` for the x-domain, and `d3.axisBottom`/`axisLeft` for ticks. Data is loaded from a CSV file and rendered as SVG circles with white strokes.

Kkoppulasudhakar03@gmail.com
81% match
Loading thumbnail…

Multiseries

This visualization presents electric range trends by vehicle type over model years as multi-series lines, alongside a combined bar and line chart showing vehicle counts and average range by county. The D3.js v7 code parses CSV data containing vehicle records from Washington State, using SVG rendering to draw axes, grid lines, and interactive hover effects with tooltips. The multi-series chart handles data aggregation for electric range trends, while the combined chart visualizes categorical county data.

Mmeangreen0067@gmail.com
78% match
Loading thumbnail…

Fork of D3 Starter

This visualization displays the number of registered vehicles per country as a horizontal bar chart, using a quantitative x-axis and categorical y-axis. The data comes from a CSV file listing ten nations with varying reference years. Built with React and D3 v5, the component loads the CSV using `d3.csv`, then maps values to scales using `scaleLinear` and `scaleBand`. Bars are rendered as SVG `<rect>` elements, while axes are constructed manually via `xLinear.ticks()` and D3’s `format` function, avoiding the built-in axis components.

Kkoppulasudhakar03@gmail.com
73% match
Loading thumbnail…

Cars

This bar chart displays the population of 20 countries for 2020, with each country represented by a horizontal bar colored light green. The visualization uses React to render SVG elements, with D3 scales and axes handling the layout. Data is loaded asynchronously via `d3.csv` from a GitHub gist, then transformed by multiplying the 2010 column by 1000. Axis components and formatted tick labels (using `d3.format`) clarify value interpretation, while hover tooltips via SVG `<title>` elements provide additional detail.

HHemanthh81
73% match
Loading thumbnail…

DV A6 T3

This visualization shows a parallel coordinates plot for six numeric car attributes—miles per gallon, cylinders, displacement, horsepower, weight, and acceleration—with lines colored by the vehicle’s origin (USA, Japan, Europe) using a small embedded CSV dataset. Using D3 v7, the code constructs vertical linear scales for each dimension via `d3.scaleLinear` and `d3.extent`, positions axes with `d3.scalePoint` and `d3.axisLeft`, and draws the polylines with `d3.line()`. The SVG rendering applies hover effects that increase stroke width and opacity, making individual car records easier to trace.

Vvineelaviswanadham07@gmail.com
72% match
Loading thumbnail…

Interactive Chart

This interactive pie chart displays vehicle registration counts by vehicle type. The visualization presents the data as proportional segments with value labels, accompanied by a legend that maps each color to a vehicle type and displays the corresponding count. The chart loads CSV data from a remote gist URL, and the code uses the D3.js v5 library, specifically the `pie`, `arc`, `scaleOrdinal`, `select`, and `csv` APIs. The SVG rendering is set up using an arc generator with custom inner and outer radii, with fixed positions for the chart and legend within a 980 by 550 pixel canvas.

SStuart Sessions
72% match
Loading thumbnail…

Multi-Series Chart — CO₂ and Renewables 2025

This example shows a multi-series combo chart comparing CO₂ emissions (bars, in million tonnes) and renewable energy percentage (line) for countries in 2025. Country data is sorted by emissions and color-coded by region. Built with D3 v7, it renders an SVG canvas and uses `d3.scaleBand`, `d3.scaleLinear`, and axes with gridlines. Data is loaded from a CSV via `d3.csv` with `d3.autoType`, and an interactive tooltip responds to hover. The chart animates on load and displays a legend for regional categories.

Vvunnamnandini13@gmail.com
72% match