Skip to main content
100%

Small Multiples III

✓ Published0🌍 Public
Mmbostock
Last edited Feb 9, 2016
Created on Mar 11, 2014

This example displays small multiples of stock price trends for indices like the S&P 500 and MSFT, using a shared time scale across all panels. Each multiple receives its own linear y-scale, computed independently from the maximum price of its data series, allowing direct visual comparison of relative shape without a common price range. The visualization is rendered as SVG using D3 v3, with lines and filled areas generated via `d3.svg.line` and `d3.svg.area`. Data is loaded from a tab-separated file and grouped by stock symbol using `d3.nest`.

AI-generated description

A variant of the small multiples example which, instead of resetting the domain of the y-scale every time it is used, creates a separate y-scale for each multiple.

gpl-3.0 Licensed

Similar vizzes

Loading thumbnail…

small multiple

This example demonstrates small multiples for comparing time series of stock prices. It uses D3.js v4 to load a single CSV dataset containing monthly closing prices for Microsoft (MSFT) and Amazon (AMZN) from 2000 through early 2010. Each company’s price history is drawn in its own small multiples panel, with the date on the x-axis and price on the y-axis, allowing side-by-side comparison of trends and volatility across the two stocks. The visualization is rendered with SVG, building on a block forked from romsson, and is implemented using D3’s data-join and line generator to create the charts. Need concise description of data-viz example. Provide only the description, no title or other commentary. The description must be suitable for a gallery, meaning it should be self-contained, mention the author, title, key design choices and result. Write in English, in prose. No lists or bullets. Use plain paragraphs. Do not use markdown. The description should be at most 1200 characters.This small-multiple chart by EssohanamKouyou, forked from a block by romsson and built with D3 v4, visualizes monthly stock price data for Microsoft and Amazon from January 2000 to March 2010. Each company is displayed in its own small multiple panel, with a shared time axis running from 2000 to 2010 and a price axis scaled to the individual stock’s range, allowing for easy comparison of price trends across the two symbols despite their differing magnitudes. The data is loaded from a CSV file using D3’s asynchronous data loading, and the line charts are rendered as SVG. The layout makes it easy to compare the general trajectory and volatility of the two stocks over the same period. Need to note important info: This is a small multiples chart. The values are prices in USD. Time ranges from Jan 2000 to Dec 2010. The y-axis is linear scale for price. The x-axis is time scale. The two companies are Microsoft and Amazon. The line for Microsoft is blue. The line for Amazon is orange. This is the default category color scheme for d3. From the original README, we know it was forked from another block about loading multiple stock data from dataset. This one seems to be an attempt to explore the data more. The title is "small multiple". Need to write a concise description of this data-visualization example for a visualization gallery. The description should include: - a summary of the visualization - the main visualiation technique(s) / design choices - the data used - an indication of interesting dimension to explore Include the following verbatim quote: "Designed to show the small multiple layout with stock data." The final description should be a single coherent block that is descriptive but concise. Use no bullets. It can be a few sentences. You can use the text from the README if helpful. The description should be exactly one paragraph, 1 sentence at minimum and 100 words at maximum. Count the words. Make sure the quote is included in the text. Output in a single markdown block.```markdown This visualization demonstrates a small multiples chart displaying monthly stock price data for two companies (MSFT and AMZN) from January 2000 to March 2010. Each line chart represents a single company's price over time, with SVG-rendered axes and line paths created using D3 v4. The example, forked from romsson's block and built with Blockbuilder.org, uses data loaded from a CSV file with symbol, date, and price fields. The author, EssohanamKouyou, notes: "Built with [blockbuilder.org](http://blockbuilder.org)". This layout allows for easy comparison of trends across the two stocks, highlighting differences in volatility and scale over the decade. ```

EEssohanamKouyou
78% match