line

100%

✓ Published1🌍 Public

Last edited Mar 29, 2026

Created on Mar 29, 2026

This line chart displays Apple’s stock price trend over time, using data from Plotly’s finance-charts-apple.csv. The visualization uses d3.csv to load the data, d3.scaleTime and d3.scaleLinear to map dates and closing prices, and d3.line to generate the SVG path. The chart includes labeled axes and a green stroke line, rendered with d3.axisBottom and d3.axisLeft.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

area

This area chart visualizes Apple’s stock price trend over time, using a light blue filled path beneath a line. It loads CSV data from Plotly’s finance-charts dataset, parses the date and closing price fields, and renders an SVG with D3 v7. The chart uses d3.scaleTime and d3.scaleLinear for axes, d3.area to generate the path, and d3.axisBottom and d3.axisLeft for the grid. Labels for “Date” and “Stock Price” are added as SVG text elements.

Hharshithamiriyam@gmail.com

86% match

Loading thumbnail…

Line Chart

A line chart displays the daily closing price of Apple (AAPL) stock from 2007 to 2008, with time on the x-axis and price in dollars on the y-axis. The SVG visualization uses D3 v4 to parse TSV data, with `d3.scaleTime` and `d3.scaleLinear` for positioning, `d3.axisBottom` and `d3.axisLeft` for axes, and `d3.line` to render the data. A steelblue stroke, 1.5 pixels wide, traces the price trend over the two-year period.

Mmbostock

85% match

Loading thumbnail…

Apple stock price display

A line chart displays Apple stock prices over time, using a red-to-green gradient to encode the value range from low to high. The chart includes axes for dates and price, plus an interactive tooltip that appears on mouseover, showing the precise price at the cursor position via a circle marker and text label. The visualization is built with D3 v4, using `d3.scaleTime`, `d3.scaleLinear`, `d3.line`, and `d3.bisector` for hover detection. Data comes from a CSV file loaded with `d3.csv`, and the SVG rendering includes a linear gradient defined with `linearGradient`.

AAdvait Maduskar

85% match

Loading thumbnail…

Fork of D3 Line Chart - 11641166

This example visualizes Apple Inc.’s average annual stock price from 2000 to 2023 as a single line chart. It uses d3.line, d3.scaleTime, and d3.scaleLinear to map years and prices, with axes generated via d3.axisBottom and d3.axisLeft. The SVG renders gridlines, labeled axes, and a purple stroke path. Data is loaded from a CSV using d3.csv, and styled with custom CSS classes.

JJasvitha Allamsetty

85% match

Loading thumbnail…

Line chart saranya

This line chart displays Apple stock prices over time, sourced from a CSV file. It uses D3.js v4 to render an SVG visualization with a blue-to-yellow gradient line. The chart includes interactive mouseover and mousemove events that reveal a data point’s exact price via a tooltip circle and text, leveraging D3’s `scaleTime`, `scaleLinear`, `line`, and `bisector` APIs.

MMalempatiSaranya

85% match

Loading thumbnail…

Stock price display - Apple

This example shows the historical stock price of Apple as a line chart, with a vertical gradient stroke transitioning from red (low values) to green (high values). It includes interactive hover functionality: moving the mouse over the chart reveals a black circle marker and a text label displaying the exact price at the nearest data point. The visualization is built using D3.js v4, leverages SVG for rendering, and uses `d3.scaleTime`, `d3.scaleLinear`, `d3.line`, and `d3.axisBottom`/`d3.axisLeft` for axes. Data is loaded from a CSV file containing date and price columns, and the chart uses a bisector for efficient nearest-point lookup during mouse movement.

TToly

84% match

Loading thumbnail…

D3 Line Chart - 11641166

This visualization displays the average stock price of Apple Inc. from 2000 to 2023. The line chart plots the yearly average stock price, with the x-axis representing time and the y-axis showing the price value. The chart uses D3 v7’s `scaleTime` and `scaleLinear` for axes, and `line` to generate the path. Data is loaded from a remote CSV file via `csv` and rendered as an SVG.

SSuresh John Wesly

84% match

Loading thumbnail…

Line chart saranya

This chart uses a line graphic to track the daily price of Apple stock over time. The graph is built with D3.js v4, using a time-scaled x-axis and a y-axis that starts at zero. The line is drawn with a linear gradient fill, shifting from blue to yellow. Hovering over the chart reveals a tooltip that shows the exact price at the cursor’s location, using a bisector to find the nearest data point. The data is loaded from a remote CSV file, and the visualization is rendered as an SVG.

MMalempatiSaranya

84% match