Skip to main content
SimilarExport ZIP
100%

Tech Stock Visualization

✓ Published2🌍 Public
JJingyuan Liu
Last edited Dec 16, 2020
Created on Dec 16, 2020

This interactive line chart visualizes the scaled closing prices of 26 tech companies throughout 2020, grouped by industry categories such as Gaming, Streaming, and Tech-Giants. The visualization uses D3 v6 with SVG rendering and animation, employing scales like d3.scaleTime and d3.scaleLinear, along with d3.line and d3.group to organize data by company index. The chart displays axes, grid lines, and industry labels, with color mapping via d3.scaleOrdinal to distinguish companies. Data is loaded from a CSV file containing daily stock price records for the year.

AI-generated description

This gives interactive plot of tech stocks of 2020.

MIT Licensed

Similar vizzes

Loading thumbnail…

Tech Stock Visualization

This visualization shows scaled closing stock prices for 26 tech companies throughout 2020, grouped by industry category (Gaming, Streaming, Work-From-Home, Online-Retail, and Tech-Giants). The interactive line chart plots timestamps against scaled closing prices, with each company’s series distinguished by a unique color. Built with D3 v6, it uses `d3.csv` to load remote data, `d3.scaleTime` and `d3.scaleLinear` for axes, `d3.line` for the paths, and `d3.curveBasis` for smoothing. The SVG rendering includes ordinal color mapping and a bottom legend, with no animations applied.

Yyamunayennem
95% match
Loading thumbnail…

Tech Stock Visualization

This visualization displays the scaled closing prices of tech stocks over time, grouped into industry categories such as Gaming, Streaming, and Tech-Giants. It uses d3.csv to load stock price data, d3.scaleTime and d3.scaleLinear for axes, and d3.line with curveBasis to render smooth lines for each company. Interactive filtering is provided through clickable legend circles, which toggle visibility of specific industries using d3.group and ordinal color scales. The SVG output includes gridlines, axis labels, and animated transitions when filtering.

JJingyuan Liu
93% match
Loading thumbnail…

A7 Small Multiples

This gallery example presents a small multiples chart displaying the opening stock prices of five technology companies—Oracle, Apple, Nvidia, Avago, and Microsoft—from 2023 to 2024. The D3.js visualization uses a CSV data source, splitting the time series into three separate time-scaled plots, each with its own x-axis and y-axis scaling. The code constructs the SVG layout with custom margins, applies a quantized color scale, and renders line charts for each company. The data is parsed from the `tech.csv` file using `d3.csv` and `d3.timeParse`, with axes and scales implemented via `d3.scaleTime` and `d3.scaleLinear`.

AAllen Jake Polintan
76% match
Loading thumbnail…

loading multiple stock data from dataset

A multi-line chart displays the monthly closing prices of three technology stocks (MSFT, AMZN, IBM) from January 2000 through March 2010, sourced from a local CSV file. The visualization distinguishes each stock with a distinct color via `d3.scaleOrdinal` and `d3.schemeCategory10`. The chart is rendered as an SVG canvas using D3 v4, with price data nested by symbol via `d3.nest`, dates parsed with `d3.timeParse`, and paths drawn using `d3.line` and `d3.curveBasis`. Axes, including a bottom x-axis and a left y-axis with 20 ticks, are generated using `d3.axisBottom` and `d3.axisLeft`. A legend maps each color to its stock symbol.

LLRobergeon
74% match
Loading thumbnail…

Untitled

This visualization displays the closing prices and trading volumes of ten stocks over time, using a logarithmic scale to compare relative changes across different price and volume ranges. Each stock is drawn as a colored line, with a dropdown or toggle option to switch between close price and volume metrics. The chart uses D3 v6 with SVG rendering and includes gridlines, axis ticks, and a time-based x-axis. Data is loaded from a CSV file hosted on GitHub, and the color palette assigns a distinct hue to each stock symbol.

Lluxingyu
73% match
Loading thumbnail…

A7 Heatmap Time Series

This heatmap visualizes the daily opening prices of five major tech companies—Oracle, Apple, Nvidia, Avago, and Microsoft—throughout 2024. Data from Yahoo Finance is encoded using a sequential color scale (interpolateGnBu) mapped to stock price values, with white spaces indicating missing days in the CSV. The x-axis uses a time scale for dates, while the y-axis uses an ordinal band scale for companies. Rows represent companies, columns represent trading days, and color intensity encodes open price. The visualization includes labeled axes, a color legend, and hover interactions on rectangles, with the color scale ranging from light blue for lower prices to dark blue for higher prices.

AAllen Jake Polintan
72% match
Loading thumbnail…

Independent scale multi-line graph

This interactive chart displays monthly stock prices for Microsoft, Amazon, and IBM from January 2000 to March 2010, with each line normalized to its own independent y-axis scale. This allows viewers to compare the shapes and relative trends of each company’s price movements without being distorted by differing absolute price ranges. Built with D3 v4 in SVG, the visualization uses `d3.nest()` to group data by symbol and `d3.scaleLinear()` to assign each line its own vertical domain. Clicking a legend label toggles the corresponding line’s opacity via a `transition()`, while `d3.axisBottom()` renders the shared time axis. Data originates from a CSV file.

Dd3noob
72% match
Loading thumbnail…

Stock Price

This interactive visualization shows stock prices for various companies over time, using horizontal bar charts grouped by company symbol. Each panel displays the price distribution for a specific stock, with bars representing individual price points and a prominent zero line for reference. The chart is built with React and D3 v6, using D3's `scaleBand` for the categorical date axis and `scaleLinear` for the price axis. Data is loaded from a remote CSV file, and bar heights and positions are computed dynamically using these scales.

Ttrucntx007
72% match