Skip to main content
100%

Cryptocurrency average order price versus size

✓ Published0🌍 Public
AAjayyy
Last edited May 17, 2019
Created on May 17, 2019

A live-updating scatter plot contrasts the average price and size of cryptocurrency buy orders, with bubble area encoding the total number of orders per instrument. The visualization streams order data through a WebSocket connection to Coinbase Pro, buffers it, and periodically updates a Perspective table that aggregates values by product. Rendering uses d3fc’s `seriesSvgPoint` and `chartCartesian` with logarithmic scales, while `d3.select` transitions and a greedy label layout place instrument names, toggled on mouseover to avoid overlap.

AI-generated description

Live streaming Crytocurrency price vs order size, using Perspective and d3fc. The size of each bubble indicates the total number of orders.

Read more about this in the blog post - realtime crypto charting with JPM Perspective and d3fc

Built with blockbuilder.org

forked from <a href='http://bl.ocks.org/ColinEberhardt/'>ColinEberhardt</a>'s block: <a href='http://bl.ocks.org/ColinEberhardt/6e287f871410ecd970b038343b166514'>Cryptocurrency average order price versus size</a>

mit Licensed

Similar vizzes

Loading thumbnail…

Cryptocurrency average order price versus size

A live-updating scatter plot contrasts the average price and size of cryptocurrency buy orders, with bubble area encoding the total number of orders per instrument. The visualization streams order data through a WebSocket connection to Coinbase Pro, buffers it, and periodically updates a Perspective table that aggregates values by product. Rendering uses d3fc’s `seriesSvgPoint` and `chartCartesian` with logarithmic scales, while `d3.select` transitions and a greedy label layout place instrument names, toggled on mouseover to avoid overlap.

AAjayyy
100% match
Loading thumbnail…

Cryptocurrency average order price versus size

This animated scatter plot shows average order price versus order size for live cryptocurrency trades, with bubble size reflecting total order count. It streams data from Coinbase’s WebSocket API, buffering messages and updating a Perspective table every 50 milliseconds. D3fc’s seriesSvgPoint renders the bubbles, while layoutLabel with layoutGreedy places instrument labels. Logarithmic scales for both axes handle the wide value ranges, and the chart transitions smoothly using d3’s transition method.

CColinEberhardt
94% match
Loading thumbnail…

Reusable D3 Scatter Plot

This reusable D3 scatter plot visualizes cryptocurrency market capitalization against 24-hour trading volume for ten major assets, with circle size encoding market dominance percentage. It uses logarithmic scales for both axes to accommodate the wide value ranges, while a square-root scale maps dominance to circle radius. The chart is built as a reusable factory function following the Bostock pattern, utilizing D3 v7's `scaleLog`, `scaleSqrt`, `scaleLog` APIs, and feature-based selection for efficient SVG updates. The code includes data parsing via `d3.csvParse` and `d3.autoType`, with hover tooltips displaying asset-specific details.

Kkhushburajan2015@gmail.com
68% match
Loading thumbnail…

Multi Cryptocurrency - Volume vs Market Cap

This interactive scatter plot visualizes the relationship between trading volume and market capitalization for selected cryptocurrencies (BTC, AAVE, XMR, LTC). Built with D3 v6 and SVG, it uses `d3.scaleLinear` for both axes and `d3.scaleOrdinal` with `d3.schemeCategory10` for color encoding. Users select a cryptocurrency via radio buttons, triggering a redraw through `d3.selectAll` and `.remove()`. The plot includes rotated x-axis tick labels and a color-coded legend. Data is loaded via `d3.csv` from a remote dataset, with axes formatted using `d3.format(".2s")`.

Ssenthilrajendran1
66% match
Loading thumbnail…

Realtime Orderbook

This example visualizes a real-time order book for cryptocurrency pairs, displaying bid and ask depth as an interactive SVG chart. It uses D3.js (v5) to render cumulative price levels, with green and red areas representing bids and asks. Data streams from Binance via Socket.IO, while a REST API fetches the initial snapshot, and the chart updates dynamically with each incoming trade. Users can switch between BTCUSDT, ETHUSDT, and BNBUSDT symbols using a dropdown menu.

ZZhou180
66% match
Loading thumbnail…

Multi Crypto Scatter Plot - Opening Price vs Highest Price

This interactive scatter plot explores the relationship between opening and highest prices for AAVE, Monero, and Litecoin cryptocurrencies. Users select a currency via radio buttons to filter the dataset, and the SVG chart redraws with new points. The visualization uses d3.csv to load price history from a GitHub-hosted CSV, d3.scaleLinear for axes, and d3.axisBottom/axisLeft to render labels. The code filters data by the Symbol column and clears the SVG before redrawing, providing a straightforward comparison of price dynamics across different digital assets.

Ssenthilrajendran1
66% match
Loading thumbnail…

Scatter Plot

A D3.js v6 scatter plot visualizes the relationship between trading volume and market capitalization for Bitcoin, using data loaded from a remote CSV file. The chart renders as an SVG with circle marks, linear scales for both axes, and formatted tick labels using `d3.format`. Axes are drawn with `d3.axisBottom` and `d3.axisLeft`, while rotated x-axis labels and a bold chart title are added via SVG text elements. The plot reveals the correlation between these two cryptocurrency metrics across the dataset.

Ssenthilrajendran1
65% match
Loading thumbnail…

Greater than 100k Alexa Rank and less 10m market cap

This scatterplot maps cryptocurrencies whose Alexa rank exceeds 100,000 against their market cap, which is under $10 million. Each circle is sized by market cap and colored by coin, with a smooth animated transition between the v2 and v3 datasets when the user clicks a button. Built with D3 v4, the SVG visualization uses logarithmic axes to accommodate the wide range of values, and the animation highlights changes in the crypto landscape over time.

WWill Carter
63% match