Untitled

100%

✓ Published0🌍 Public

Last edited Dec 13, 2021

Created on Dec 12, 2021

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.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

Similar vizzes

Loading thumbnail…

Untitled

This visualization displays the relative performance of multiple stocks over time, with lines for each stock colored according to a categorical palette. The y-axis uses a logarithmic scale to show the ratio of each stock’s current value to its initial value, enabling comparison of percentage changes across different price levels. The chart is built with D3.js v6 within a React framework, using `d3.scaleLog`, `d3.line`, and `d3.axisLeft` with gridlines, and is rendered as an SVG with animation support. Data is fetched from a CSV file containing stock prices and volumes.

Yyinghao11

87% match

Loading thumbnail…

Untitled

This visualization displays multiple stock price trends over time as colored lines on a shared time-series chart. The code loads data from a CSV file, parses dates, and groups entries by symbol using `d3.group`. It renders SVG paths with a steelblue stroke overridden by a categorical color scale (`d3.scaleOrdinal` with `d3.schemeCategory10`), and adds axes via `d3.axisBottom` and `d3.axisLeft`.

YYujunliu95

85% match

Loading thumbnail…

Untitled

A line chart tracks stock closing prices over a three-week period in April–May 2012, with each data point drawn as a red circle from the CSV data. Interactive tooltips appear on mouseover, displaying the formatted date and closing value. The visualization uses D3.js version 3.5.17 to build an SVG with a time-scaled x-axis, linear y-axis, and animated transitions for the tooltip opacity.

SSrishti2398

82% match

Loading thumbnail…

Untitled

This interactive scatterplot displays stock data with price on the x-axis and true value on the y-axis, using colored circles to represent stock types. Users filter the visualization through a dropdown menu for sector selection and jQuery UI sliders that adjust volume and delta ranges. The D3.js code loads data from a CSV file, applies keyed enter/update/exit selections, and includes hover tooltips that highlight individual stocks. The SVG renderer uses d3.axisBottom and d3.axisLeft for axes, with d3.scaleOrdinal for categorical coloring.

Mmkolowrat

81% match

Loading thumbnail…

Untitled

A line chart displays stock closing prices over time for two datasets. An "Update" button triggers an animated transition between the datasets, smoothly interpolating both the line path and the x- and y-axes using D3.js transitions with a 750-millisecond duration. The visualization uses d3.svg.line, d3.time.scale for time-based x-axis formatting, and d3.svg.axis, with data loaded from CSV files via d3.csv. The SVG path and axes are updated in place, demonstrating dynamic data swapping.

CChase Hall

81% match

Loading thumbnail…

Untitled

This interactive banking dashboard visualizes daily closing prices for multiple bank stocks over time, with a dropdown menu that filters the chart to show a single stock or all groups. The visualization uses React with D3 v4, rendering an SVG line chart with a time-scaled X-axis, linear Y-axis, and a categorical color scale from `d3-scale-chromatic`. Data is loaded from a CSV file, grouped with `d3.nest()`, and each stock’s price trend is drawn as a separate colored line. The interface includes a styled header and descriptive text about banking sector risks.

SSheela2930

81% match

Loading thumbnail…

Untitled

This interactive line chart visualizes the High and Low values of stock symbols from the National Stock Exchange of India, with an animated transition between the two metrics. A dropdown menu lets users switch between the High and Low series, triggering a smooth data update. The visualization uses d3.csv to load data, d3.scaleBand for the categorical x-axis, d3.scaleLinear for the y-axis, and d3.line to draw the path, with circles marking data points. The update function employs d3 transitions over 1000 milliseconds to animate the line and dots, rendered as SVG elements.

SSheela2930

80% match

Loading thumbnail…

Untitled

A line chart compares the daily open and close prices of a financial asset, plotting both series over time with a steelblue line for close values and a red line for open values. The code uses `d3.csv` to load data from `data2.csv`, `d3.timeParse` to convert date strings, and `d3.scaleTime` and `d3.scaleLinear` to set up the axes. SVG paths are drawn with `d3.line`, and `d3.axisBottom` and `d3.axisLeft` render the time and price scales.

Yyinghao11

80% match