Area chart

100%

✓ Published0🌍 Public

Last edited Mar 26, 2026

Created on Mar 25, 2026

This area chart tracks electric vehicle sales in thousands over a sequence of years, using D3.js v7 with SVG rendering. The code loads a CSV dataset via `d3.csv`, sorts the data chronologically, and applies linear scales with `d3.scaleLinear` for both axes. It generates a filled area path using `d3.area` and overlays a stroked line with `d3.line`, plus data point circles. Axis labels and a bold title are included, with the chart drawn within a defined margin using the SVG coordinate system.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

area chart

This area chart visualizes car sales over time, using a yellow filled region beneath a smooth line to emphasize the trend up to 2009. The code employs D3 v5’s `area` and `line` generators with `curveBasis` for smoothing, scaling time and linear axes via `scaleTime` and `scaleLinear`. Data is loaded from a CSV using `d3.csv`, with dates parsed via `timeParse`. SVG output includes styled grid lines, axis labels, and a title.

Nnagarjuna1968

87% match

Loading thumbnail…

Area Chart

This area chart displays car sales totals from 2013 to 2023, with a green filled region beneath a thick black curved line. The visualization uses D3 v5 with SVG rendering, employing `d3.scaleTime` for the x-axis, `d3.scaleLinear` for the y-axis, and `d3.area` with `d3.curveBasis` to generate the smoothed area. Data is loaded from a CSV file via `d3.csv`, while `d3.axisLeft` and `d3.axisBottom` render labeled axes with tick marks.

VVAbhiram99

86% match

Loading thumbnail…

area chart

This area chart displays yearly sales data loaded from an external CSV file, with the x-axis representing years and the y-axis representing sales figures. Using D3 v7, the visualization generates an SVG area path filled in steel blue, with axes and labels for both dimensions. The code employs `d3.area()` to create the filled region, `d3.scaleLinear()` for both scales, and `d3.axisBottom` and `d3.axisLeft` to render the axes, all appended to a single SVG element sized at 800 by 400 pixels.

Rr79162810@gmail.com

86% match

Loading thumbnail…

Area Chart

This area chart displays annual US automotive sales from 2005 to 2022, with dates on the x-axis and sales numbers on the y-axis. Using D3 v5, the code loads CSV data and renders an SVG with `d3.scaleTime` and `d3.scaleLinear` for scales, `d3.axisLeft` and `d3.axisBottom` for axes, and `d3.area` with `curveBasis` to generate the filled path. The chart includes labeled axes and a title, with data sourced from a GitHub gist.

RRavi Teja Bonam

86% match

Loading thumbnail…

Area Chart

This area chart displays sales data from 2000 to 2023, with the year on the x-axis and sales figures on the y-axis. The chart is rendered as an SVG using D3 v5, loading data from a CSV file hosted on GitHub. The visualization uses `d3.scaleTime` and `d3.scaleLinear` for axes, along with `d3.line` and `d3.area` generators with `curveBasis` to create smooth lines and the shaded region beneath. Axis labels are styled with orange, and gridlines are generated via axis tick marks.

Jjaswanthreddy2000@gmail.com

86% match

Loading thumbnail…

Area Chart

This area chart shows car sales from 2001 to 2010, with the year on the x-axis and sales on the y-axis. The chart uses D3 v5 to load CSV data, apply time and linear scales, and render SVG axes with grid lines. An `area` generator with `curveBasis` creates a smoothed filled region below the sales line, styled in blue. The title and axis labels are added as SVG text elements.

Eeravellisaimeghana

86% match

Loading thumbnail…

Area Chart

This area chart displays electronic sales from 2013 to 2021, with a green filled region under a black smoothed line. The visualization uses D3 v5 with SVG rendering, employing `scaleTime` for the year axis and `scaleLinear` for sales values. Data is loaded from a CSV file via `d3.csv`, and both `d3.line` and `d3.area` generators with `curveBasis` create the chart. Axes are customized with `axisBottom` and `axisLeft`, including gridlines and labels.

Kkranthireddyskr

85% match

Loading thumbnail…

Area Chart

This area chart displays monthly sales figures from a CSV file, with a light blue shaded region beneath a blue line to emphasize the trend over time. The visualization uses D3.js v7, leveraging `d3.area` and `d3.line` generators to construct the paths, while `d3.scalePoint` and `d3.scaleLinear` handle the categorical month axis and numerical sales axis. The plot is rendered as SVG within an HTML page, with labeled axes and a title.

Ppvvaishnavi93@gmail.com

85% match