Fork of ICE 7 Area Chart

100%

Fork of ICE 7 Area Chart

✓ Published0🌍 Public

Last edited Mar 12, 2023

Created on Mar 11, 2023

This visualization displays the average US net worth over time using a combined line and area chart, with the area filled in orange and the line drawn in black. It loads CSV data from a GitHub gist and parses the year values as dates. The chart uses D3 v5 APIs including `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, `line`, and `area`, with `curveBasis` applied to smooth both the line and area paths. The SVG rendering includes gridlines, labeled axes, and a bold blue title.

AI-generated description

combined line and area charts

MIT Licensed

Similar vizzes

Loading thumbnail…

ICE-7 Area chart

This example visualizes the net worth of the richest people over time using an area chart. The chart encodes years on the x-axis and net worth on the y-axis, with a smooth, curved area fill that emphasizes the changing magnitude of wealth. The visualization is built with D3 v5, using `select`, `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, `line`, `area`, and `curveBasis` to render the SVG paths and axes. Data is loaded from a CSV file hosted on GitHub, with net worth parsed as numbers and years as dates before rendering.

Cchandrakalavanukuri

85% match

Loading thumbnail…

Fork of ICE 7 -4

This visualization displays U.S. household income trends over time as a smooth line over a filled area chart. The SVG graphic, rendered with D3 v5, uses `d3.line` and `d3.area` with a Basis curve to connect yearly data points. The chart, titled "USA Income by year," loads CSV data from a GitHub gist, employs `d3.scaleLinear` for axes, and includes axis labels and tick marks via `d3.axisBottom` and `d3.axisLeft`.

AAmar09nath

84% match

Loading thumbnail…

Fork of Fork of ICE 7 Area Chart

This visualization shows the percentage of the USA population from 1960 to 2020 using a combined line and area chart, with a smooth curve connecting annual data points. The line traces the trend in maroon, while a pink fill highlights the area beneath the curve. Built with D3 v5, the code uses `d3.line`, `d3.area`, and `curveBasis` to generate the smoothed paths, with `d3.scaleLinear` and `d3.axisBottom`/`d3.axisLeft` for axes. Data is loaded from a remote CSV via `d3.csv` and rendered into an SVG.

TTejucmandava

83% match

Loading thumbnail…

Fork of ICE 7 Area Chart(Test)

This area chart visualizes Amazon's annual net income from 1994 to 2020. The visualization uses D3 v5 to render an SVG, plotting time on the x-axis and net income in millions on the y-axis. It applies the `scaleTime` and `scaleLinear` APIs for axes, uses `axisBottom` and `axisLeft` for ticks, and draws a smooth line with `curveBasis` while filling the area beneath with a wheat color. The data is loaded from a CSV file via `csv()` from the d3 module.

VVamsi Krishna

83% match

Loading thumbnail…

Fork of ICE 7-3

This line chart visualizes USA income by year from 1999 to 2013, plotting income values against a time-based x-axis. The SVG rendering uses D3 v5 APIs including `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` to generate the chart, with data loaded from a GitHub-hosted CSV file via the `csv` function. The chart applies margins, axis labels, and a purple title, with blue styled line paths and styled tick marks.

AAmar09nath

83% match

Loading thumbnail…

Fork of Fork of Line Chart

This line chart displays the average US net worth over time, using a red stroke to emphasize the trend. The chart loads CSV data from a GitHub gist, parses the year and worth values, and renders an SVG with axes, labels, and a title. It uses D3 v5 methods including `csv`, `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` to construct the visualization.

JJustin Roberts

83% match

Loading thumbnail…

Fork of ICE-7 Area Chart

This fork of ICE-7 Area Chart visualizes the cost of sales from 2000 to 2013 using an area chart with a smooth curve. The SVG rendering uses D3 v5 APIs including `scaleTime`, `scaleLinear`, `area`, `line`, `curveBasis`, `axisLeft`, and `axisBottom`. A black line traces the data while a yellow filled area beneath it emphasizes the trend. The chart loads CSV data from a GitHub gist, formats years as dates, and labels axes with the provided titles.

Ssumit

82% match

Loading thumbnail…

Fork of Fork of ICE 7 Area Chart

This visualization combines a line chart and an area chart to display sales trends over time, with the area fill highlighting the magnitude of change. The chart uses a time-scaled x-axis and a linear y-axis with gridlines, and the line is smoothed using a basis curve. Built with D3 v5, the code creates SVG paths via the `line` and `area` generators, and loads its data from a CSV file containing population figures.

Bbindhureddy98

82% match