Fork of Area Chart

100%

Fork of Area Chart

✓ Published0🌍 Public

Last edited Mar 27, 2022

Created on Mar 27, 2022

This fork of an area chart visualizes sales data from 1988 to 2006, combining a smooth line and a brown filled area beneath it to emphasize trends over time. The axes display year and sales values, formatted with `d3.format`. The code uses D3 v5 APIs including `csv` for data loading, `scaleTime` and `scaleLinear` for scales, and `line` alongside `area` generators with `curveBasis` for smoothing. The SVG output is styled with CSS, featuring a yellow background and labeled axes.

AI-generated description

combined line and area charts

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Area Chart

This is a fork of an area chart that visualizes electronic sales from 2013 to 2021. The chart combines a black line and a green filled area beneath it, with both rendered as SVG paths using D3 v5’s `line` and `area` generators with `curveBasis`. The x-axis maps years parsed via `d3.timeParse`, while the y-axis shows sales values formatted with `.3s`. Axes are created with `axisBottom` and `axisLeft`, and scales use `scaleTime` and `scaleLinear`. Data is loaded asynchronously from a CSV file using `d3.csv`.

Rrohinikotha

92% match

Loading thumbnail…

Fork of Area Chart

This fork of an area chart visualizes trades from 1950 to 2005, with sales values plotted over time using a smooth curve. The rendering uses SVG, with D3 v5 functions including `scaleTime`, `scaleLinear`, `line`, `area`, and `curveBasis` to generate a brown stroke line and pink filled region. Axis labels are formatted with `d3.format`, and the data is parsed from a CSV file hosted on GitHub, with dates converted via `d3.timeParse`. The chart includes custom styles for the tick text, axis labels, and the colored line and area paths.

Kkalyanikotha

91% match

Loading thumbnail…

Fork of Area Chart

This fork of an area chart visualizes electronic sales from 2013 to 2021 using D3 v5 with SVG rendering. The view combines a smooth green area path with a black line overlay, both generated via d3.area and d3.line with curveBasis, while scaleTime and scaleLinear map the Year and Sales data. Axes are drawn with axisBottom and axisLeft, and the CSV data is loaded asynchronously from a GitHub gist.

RRahulSai05

91% match

Loading thumbnail…

Fork of Area Chart

This chart displays electronic sales from 2013 to 2021, combining a smooth line and a filled area to emphasize the sales trend over time. The visualization uses a time-scaled x-axis for sales dates and a linear y-axis for year values. Built with D3 v5, it employs `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, `line`, and `area` generators with a basis curve. The SVG rendering includes styled grid ticks and axis labels, with data loaded from a remote CSV file.

RRahulSai05

90% match

Loading thumbnail…

Fork of Area Chart

This visualization shows electronic sales from 2013 to 2021 using both a filled area chart and an overlaid line chart to emphasize the trend. It uses d3.csv to load data from a GitHub Gist, then renders SVG paths via d3.line and d3.area with the curveBasis interpolation. Axes are built with d3.axisBottom and d3.axisLeft, while scales employ d3.scaleTime and d3.scaleLinear, with the area fill colored green and the line stroke in black.

Rrohinikotha

90% match

Loading thumbnail…

Fork of Area Chart

This example shows electronic sales from 2013 to 2021 with a combined line and area chart. The visualization overlays a smooth black line representing yearly sales trends with a green filled area beneath it, using d3.line(), d3.area(), and curveBasis for interpolation. The SVG chart uses d3.scaleTime and d3.scaleLinear for axes, with d3.axisLeft and d3.axisBottom adding gridlines and labels. Data is loaded as CSV from a GitHub gist, parsed with d3.timeParse, and rendered using D3 v5.

Rrohinikotha

90% match

Loading thumbnail…

Fork of Area Chart

This fork of an area chart visualizes electronic sales from 2013 to 2021. The SVG graphic uses a green filled area under a black line to show sales trends over time. The code leverages D3 v5 APIs including `scaleTime`, `scaleLinear`, `axisLeft`, and `axisBottom` to construct the axes, and `line` and `area` generators with `curveBasis` for smooth curves. Data is loaded from a remote CSV file using `csv` and parsed with `timeParse`.

Kkalyanikotha

89% match

Loading thumbnail…

Fork of Area Chart

The chart shows 15 years of car sales using a combined line and area chart. A black line traces sales over time, while a grey filled area beneath it emphasizes the trend, with axes labeled "Sales" and "Year." It uses D3 v5 APIs including `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, `line`, and `area` with `curveBasis` for smoothing. The SVG rendering loads CSV data from a remote gist, parses dates, and formats the y-axis tick labels with `format('.3s')`.

Ssudhamshu24

89% match