Skip to main content
SimilarExport ZIP
100%

Area Chart (Based on Line)

✓ Published0🌍 Public
Kkhushburajan2015@gmail.com
Last edited Oct 26, 2025
Created on Oct 26, 2025
Forked from Line Chart

This area chart visualizes the monthly 2024 closing prices of Bitcoin (BTC) and Ethereum (ETH) from an embedded CSV dataset. It overlays two semi-transparent filled regions with distinct colors, with a solid line stroke on top of each to clarify the trend. The visualization is built using d3.scaleTime, d3.scaleLinear, and the d3.area and d3.line generators, rendering to SVG with axes formatted via d3.axisBottom and d3.axisLeft. A legend identifies each asset, and the chart includes axis titles for month and price.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Line Chart

A multi-series line chart compares monthly 2024 price trends for Bitcoin and Ethereum, using two distinct colored lines to show each cryptocurrency's rise and fall over the year. The chart includes a legend identifying each asset, labeled axes, and a title. Built with D3.js v7, the visualization uses `d3.csvParse` to ingest inline data, `d3.groups` to separate series, `d3.scaleTime` and `d3.scaleLinear` for axes, `d3.line` to generate paths, and `d3.axisBottom`/`d3.axisLeft` for ticks, all rendered as SVG with `d3.select` and `d3.append`.

Kkhushburajan2015@gmail.com
86% match
Loading thumbnail…

Area chart

This area chart visualizes Bitcoin prices from 2011 to 2021, showing an upward trend with fluctuations. The chart uses D3 v7 to load CSV data and render SVG paths, employing `d3.scaleTime`, `d3.scaleLinear`, and `d3.axisBottom`/`d3.axisLeft`. The area generator (`d3.area`) with a basis curve fills the space between the line and baseline in maroon, while gridlines and axis labels clarify the year and price values.

JJagadeshwar Reddy. Chilakamarri
79% match
Loading thumbnail…

AreaChart

This area chart visualizes Bitcoin prices over time using a dataset loaded via `d3.csv` from a GitHub gist. The code parses the CSV, then uses `d3.scaleLinear` for both axes and `d3.area` to generate the filled path beneath the line. A linear gradient, defined with `linearGradient` and `stop` elements, transitions the fill from semi-transparent steelblue to transparent, enhancing the visual depth. Axis labels are added manually, and the chart is rendered as an SVG within a styled container.

JJagadeshwar Reddy. Chilakamarri
78% match
Loading thumbnail…

area chart

This area chart displays the monthly closing price of a single financial symbol over time. The visualization uses an SVG rendered through D3 v4, loading data from a TSV file. The chart employs `d3.area()` to generate the filled path, with `d3.scaleTime()` for the x-axis and `d3.scaleLinear()` for the y-axis. Axes are added using `d3.axisBottom()` and `d3.axisLeft()`, with the y-axis labeled "Price ($)". The data appears to be sourced from a gist.

EEssohanamKouyou
77% match
Loading thumbnail…

Areachart

This visualization shows yearly Bitcoin price data as an area chart, with the shaded region representing price values over time. The x-axis displays years using a point scale, while the y-axis uses a linear scale for price. The chart is rendered as SVG using D3 v5, employing `scalePoint`, `scaleLinear`, `area` with `curveBasis`, and `axisBottom`/`axisLeft`. Data is loaded from a CSV file via `d3.csv`, and grid lines extend across the plot area via tick sizes.

JJagadeshwar Reddy. Chilakamarri
76% match
Loading thumbnail…

Line Chart with D3.js

This line chart visualizes the daily closing price of Bitcoin from December 31, 2017, to April 1, 2018, using data fetched from the CoinDesk API. The chart is drawn as an SVG using D3.js v4, with a time-scaled x-axis and a linear y-axis representing price in dollars. The line path is generated via `d3.line()` with rounded line joins and caps, styled in steel blue, and axes are labeled using `d3.axisBottom` and `d3.axisLeft`. The dataset, parsed into date–value pairs, is rendered without additional point marks, focusing on the trend.

TTajallah-maryam
74% match
Loading thumbnail…

Area chart

This area chart displays Amazon’s daily closing stock prices from May to August 2019. The SVG visualization uses d3.csv to load the data, d3.timeParse for dates, and d3.scaleTime and d3.scaleLinear for axes. A d3.area generator fills the region beneath the price line, rendered as a black path with 30% opacity, with labeled time and price axes.

Vvaishnavgck@gmail.com
73% match
Loading thumbnail…

ICE 7 Area Chart

This area chart visualizes Bitcoin prices from 2008 to 2020, combining a black line for the price trend with a green filled area beneath it. The chart uses D3 v5’s `scaleTime` and `scaleLinear` for axes, along with `line` and `area` generators with a `curveBasis` interpolation. The SVG rendering includes gridlines via axis tick sizes and data is loaded from a CSV file using `d3.csv`.

PPYATA SHARAN
73% match