Fork of RC 007 Bar Chart of stock data

100%

Fork of RC 007 Bar Chart of stock data

✓ Published0🌍 Public

Rrichardcorreia@my.unt.edu

Last edited Oct 26, 2025

Created on Oct 25, 2025

Forked from RC 007 Bar Chart of stock data

This fork of the Observable bar chart shows Amazon (AMZN) stock price and trading volume on a dual-axis, zoomable SVG chart. The visualization combines a steelblue volume bar series with an orange price line, plus a final price point marker and an interactive data table. It uses d3.csvParse to load data from a gist, then d3.scaleTime, d3.scaleLinear, d3.axisBottom, d3.axisLeft, and d3.axisRight to render the axes and grid lines.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

RC 007 Bar Chart of stock data

This example combines a time-series price line with volume bars to chart Amazon (AMZN) stock data. The orange close-price line uses d3.line, while semi-transparent steelblue rectangles represent trading volume against a separate right axis. Both axes are rendered with d3.axisBottom and d3.axisRight, and the chart includes dashed grid lines. Data loads from a remote CSV via the AllOrigins proxy and parses with d3.csvParse, then displays a preview table and loading message below the SVG.

Rrichardcorreia@my.unt.edu

90% match

Loading thumbnail…

RC 007 Bar Chart of stock data with shading

This bar chart displays Amazon (AMZN) stock price and trading volume over time, with a light gray shaded area beneath the orange price line to emphasize the closing price trend. The visualization combines a time-scaled x-axis with dual y-axes: price on the left and volume on the right, using steelblue bars for volume. Built with D3 v7, the code parses CSV data via `d3.csvParse`, scales with `d3.scaleTime` and `d3.scaleLinear`, and renders SVG elements including axes, grid lines, bars, and an area path.

Rrichardcorreia@my.unt.edu

89% match

Loading thumbnail…

RC 007 Stock Price

This example visualizes AMZN stock price and volume with a dual-axis chart. An orange line shows closing prices over time, while semi-transparent steelblue bars represent trading volume on a separate right-hand scale. The visualization uses D3 v7 with SVG rendering, employing `d3.csv` to load stock data, `d3.scaleUtc` for time axes, `d3.scaleLinear` for the two value axes, and `d3.zoom` for interactive panning and zooming. A hover tooltip displays date, price, and volume details for individual data points.

Rrichardcorreia@my.unt.edu

83% match

Loading thumbnail…

Fork of Line Chart- Data Visualization

This line chart displays Amazon stock prices over time, with the year on the x-axis and price on the y-axis. It uses d3.scaleTime and d3.scaleLinear to map the data, d3.axisBottom and d3.axisLeft for the labeled axes, and d3.line to generate the path. The data is loaded from a remote CSV file and parsed with d3.timeParse. The chart is rendered as SVG with gridlines from tickSize, axis labels, and styled line and text elements via CSS.

AAngel Alfredo

78% match

Loading thumbnail…

Fork of Bar Chart D3

This bar chart visualizes XYZ Foods stock prices over time, with dollar-labeled y-axis ticks and a year-based x-axis. The chart uses D3 v4’s `d3.scaleBand` and `d3.scaleLinear` for positioning, `d3.axisBottom` and `d3.axisLeft` for axes, and SVG `rect` elements for bars. Data loads from an external CSV file via `d3.csv`, with the chart rendered inside an SVG container.

SSimon Hackbert

78% match

Loading thumbnail…

Fork of Line Chart- Data Visualization

This line chart displays Amazon stock prices over time, using year on the x-axis and price on the y-axis with gridlines. It loads CSV data and parses dates with `d3.timeParse`. The visualization uses D3 v5 scales (`scaleTime`, `scaleLinear`), axes (`axisBottom`, `axisLeft`), and a `line` generator to draw the path in an SVG. Formatting includes rotated axis labels and styled tick marks.

Yyaswanthsen

76% match

Loading thumbnail…

Fork of Apple stock price display

This fork of the Apple stock price display visualizes historical stock values over time using an SVG line chart. A green-to-red linear gradient colors the line based on price range, and a hover interaction reveals a labeled circle showing the exact price at the cursor position. The visualization uses d3.v4 with d3.scaleTime, d3.scaleLinear, d3.axisBottom, d3.axisLeft, d3.line, and d3.bisector for mouse tracking. Data is loaded from a CSV file hosted on GitHub, and the chart updates dynamically via d3’s event handlers.

AAndrej38995

76% match

Loading thumbnail…

Fork of RC UNT Fork of Stylised Bar chart

This interactive React dashboard visualizes financial ratios by combining a bar chart of asset turnover with a tooltip-driven interface. Data is loaded via `d3.csv` from a GitHub gist containing quarterly financial ratios. Users can filter by company using a dropdown menu and reset zoom on both charts. The bar chart uses `d3.axisBottom`, `d3.axisLeft`, and `scaleLinear` for positioning, with hover effects changing bar color. A second scatter plot appears to be included but is initialized without visible rendering logic in the provided code.

Rrichardcorreia@my.unt.edu

75% match