fresh block

100%

✓ Published0🌍 Public

Last edited May 23, 2018

Created on May 23, 2018

A single blue line traces Amazon's daily closing stock price from July to February, showing a gradual rise with notable dips and peaks. The SVG chart includes labeled axes for date and price in dollars. Built with D3.js v3, it loads data from a CSV file, uses `d3.time.scale` and `d3.svg.line` to map the temporal and linear values, and renders the line and axes via SVG paths within a viewBox.

AI-generated description

Built with blockbuilder.org

mit Licensed

Similar vizzes

Loading thumbnail…

fresh block

The visualization shows a time-series area chart of stock prices, with the area colored red for values above 150 and blue for values below 150, highlighting threshold crossings. It uses D3.js (v3) with `d3.svg.area()`, `d3.time.scale()`, and `d3.svg.axis()` to render the SVG. Data is loaded from an external TSV file and parsed with `d3.time.format`. The code splits the dataset into contiguous segments based on the price threshold, then draws each segment as a separate colored area path. Axes are added for time and price, with the y-axis labeled “Price ($)”.

AAaronWitter

83% match

Loading thumbnail…

LINE GRAPH

This line graph shows the daily closing stock prices of Amazon from May to August 2019. The SVG chart uses d3.csv to load the data, d3.timeParse and d3.scaleTime for the time axis, and d3.scaleLinear for the price axis. D3’s d3.line generator draws a black line path through the points, with axis labels "Time" and "Closing Stock Prices" added via SVG text elements.

Vvaishnavgck@gmail.com

80% match

Loading thumbnail…

fresh block

A line chart displays monthly values over time, with each data point shown as a semi-transparent grey circle. Hovering a circle highlights it in red, displays the numeric value as text, and draws a dashed vertical guide line to the baseline. The visualization uses D3 v4 with `d3.scaleTime`, `d3.scaleLinear`, `d3.line`, and `d3.json` to load and render the dataset, while `d3.select` and `transition` manage the interactive hover effects in an SVG container.

MMilowB

79% match

Loading thumbnail…

fresh block

A single black line chart plots monthly values from a small JSON dataset, with light gray circles marking each data point. Hovering a circle turns it red, displays the exact value above it, and draws a dashed vertical guide line to the baseline. The visualization uses D3 v4 with SVG rendering, applying `d3.scaleTime`, `d3.scaleLinear`, and `d3.line` for the chart, plus mouseover handlers to toggle the interactive details. Axis labels show abbreviated month-year formats, with the final value annotated in larger monospace text.

NNpfn

79% match

Loading thumbnail…

fresh block

This visualization shows the monthly stock prices of Microsoft, Amazon, and IBM from January 2000 to March 2010 as multi-series line charts. The chart uses a filled area beneath each line to emphasize price trends over time, with the data nested by company symbol. Built with D3 v4, it employs `d3.nest()`, `d3.scaleTime()`, `d3.scaleLinear()`, and `d3.line()` with a basis curve, rendering to SVG. The data is loaded from a local CSV file via `d3.dsvFormat`.

NNpfn

79% match

Loading thumbnail…

fresh block

This example shows a monthly time series as a simple line chart with circular markers for each data point, drawn using SVG. D3 v4 scales, a time parser, and a line generator map the dataset’s dates and values to positions. On mouseover, the code highlights the hovered circle in red, reveals its dashed vertical guide, and displays its numeric value with a font-size transition; mouseout reverses the effect. The data comes from a local JSON file, and all interactions rely on D3 selections and transitions.

AAminaSGitHub

79% match

Loading thumbnail…

fresh block

A line chart displays monthly values for twelve categories labeled A through L, with circles marking each data point and dashed vertical guides from the baseline. Hovering a circle highlights it in red, fades in the corresponding value label and guide line, then restores them on mouseout. The visualization uses d3.line, d3.scaleTime, and d3.scaleLinear to position marks, with transitions on opacity for interactive feedback. Data comes from a local JSON file, and rendering occurs in SVG with a monospace font for numeric labels.

KKylaste

79% match

Loading thumbnail…

fresh block

The visualization compares monthly stock prices for Microsoft, Amazon, and IBM from 2000 to 2010. It presents four distinct area-chart modes—transparent, stacked, separated, and centered—each animated to show the same data under different spatial arrangements. Built with D3.js v4, the code uses `d3.scaleTime`, `d3.scaleLinear`, `d3.area`, and `d3.curveBasis` to render smooth SVG paths. A legend identifies each company by color. The animation transitions between chart types, highlighting how each layout affects the perception of price trends and comparative performance.

HHakkahi

79% match