Skip to main content
SimilarExport ZIP
100%

renduFinalTp3

✓ Published0🌍 Public
NNaamaNaa
Last edited Nov 29, 2017
Created on Nov 29, 2017

This visualization animates monthly stock prices for Microsoft, Amazon, and IBM from 2000 to 2010, displaying each company’s price history as a separate small-multiple line chart. After an initial stroke-drawing animation, the view transitions into a horizon chart layout, using stacked, color-coded areas to compress the vertical scale. The code relies on D3 v3’s `d3.svg.line`, `d3.svg.area`, `d3.nest`, and `d3.timer` to process the CSV data and orchestrate the SVG transitions between the two chart types.

AI-generated description

Built with blockbuilder.org

mit Licensed

Similar vizzes

Loading thumbnail…

renduFinalTp3

This visualization animates monthly stock prices for Microsoft, Amazon, and IBM from 2000 to 2010, displaying each company’s price history as a separate small-multiple line chart. After an initial stroke-drawing animation, the view transitions into a horizon chart layout, using stacked, color-coded areas to compress the vertical scale. The code relies on D3 v3’s `d3.svg.line`, `d3.svg.area`, `d3.nest`, and `d3.timer` to process the CSV data and orchestrate the SVG transitions between the two chart types.

NNaamaNaa
100% match
Loading thumbnail…

renduFinalTp3

This example animates a multi-series line chart of monthly stock prices for Microsoft, Amazon, and IBM from 2000 to 2010. The visualization first draws each company’s price history as a separate line, then transitions into a stacked area chart. Using D3.js v3 and SVG, it employs `d3.svg.line`, `d3.svg.area`, `d3.layout.stack`, and `d3.timer` to orchestrate the sequential animation, with data loaded from a CSV file via `d3.csv`.

NNaamaNaa
96% match
Loading thumbnail…

Tp3_DV_Rendu2

This visualization compares monthly stock prices for Microsoft, Amazon, and IBM from 2000 to 2010. It displays multiple small multiples, each showing a company’s price trend as a smooth line chart, with the data loaded from a CSV file. Using D3 v3, the code groups data by symbol via `d3.nest`, sorts companies by maximum price, and animates the drawing of each line progressively with a timer. An area fill, rendered via `d3.svg.area`, is added beneath each line, and the axis and scaling are computed dynamically per company.

AAminaSGitHub
93% match
Loading thumbnail…

Tp3_DV_Rendu5

This visualization compares the monthly stock prices of Microsoft, Amazon, and IBM from 2000 to 2010, showing both individual time series and a stacked area chart. The animation transitions through three views: individual line charts, horizon-style areas for each symbol, and finally a stacked layout. The code uses D3 v3 with SVG rendering, employing d3.svg.line, d3.svg.area, and d3.layout.stack for the layouts, while d3.time.scale handles the date axis. Data comes from a CSV file grouped by stock symbol via d3.nest.

AAminaSGitHub
92% match
Loading thumbnail…

TP3 animation

This visualization animates the monthly stock prices of Microsoft, Amazon, and IBM from 2000 to 2010 using an animated line chart. It first draws each company’s price line progressively, then transforms the view into a horizon chart by stacking three colored area bands per symbol. The code relies on D3 v3’s `d3.svg.line`, `d3.svg.area`, `d3.time.scale`, `d3.nest`, and `d3.timer` to build the SVG animation, reading data from a CSV file.

LLRobergeon
92% match
Loading thumbnail…

P3

This visualization animates monthly stock prices for Microsoft, Amazon, and IBM from 2000 to 2010, first drawing each company’s price line in sequence, then transforming the chart into a horizon graph. The horizon technique uses stacked, clipped area bands with a color scale to compact multiple price ranges into a small vertical space. The code uses D3 v3 for SVG rendering, `d3.svg.line`, `d3.svg.area`, `d3.nest`, and `d3.timer` to drive the two-stage animation, with data loaded from a CSV file.

SStephenMaturrin
91% match
Loading thumbnail…

TP3 animation

The visualization animates monthly stock prices for Microsoft, Amazon, and IBM from 2000 to 2010. It initially plots each company's price line individually, then transforms all three into a stacked horizon chart. The code uses d3.svg.line and d3.area generators with basis interpolation, d3.time.scale for the date axis, and d3.timer for the animation sequence. The final view uses d3.scale.ordinal colors and a clipPath to create the layered horizon effect. Data comes from the bundled dataset.csv file.

LLRobergeon
91% match
Loading thumbnail…

Tp3_DV_Rendu3

This interactive visualization displays the historical stock prices of Microsoft, Amazon, and IBM from January 2000 to March 2010. It uses a combination of individual line charts and a stacked area chart to compare the price trends and relative magnitudes across the three companies. The visualization is rendered as an SVG using D3 version 3, with animated transitions that convert between the line and stacked area representations. The code leverages D3’s time and linear scales, category color palette, and layout stack API to process and display the data from the provided CSV file.

AAminaSGitHub
90% match