Live order book / depth chart
This demo shows how to build a simple order book (market depth) chart with an amCharts 4 XYChart. It shows the real distribution of buy and sell orders, and their volume, for the ETH/BTC pair (Ether priced in bitcoin).
Live data loading and processing
This chart uses amCharts 4 built-in external data loading to fetch the top 50 bids and asks from the public Binance market data API. The endpoint allows cross-origin requests and needs no API key, so the data loads directly in the browser.
Since the API returns data in a format that is not directly compatible with the chart, we pre-process it using the parsedData adapter.
The chart is set to reload the data every 30 seconds.
More about loading external data
Adapters
Adapters in amCharts 4 is a very powerful concept. It allows defining custom functions to dynamically modify just about any value or property on the chart, including dynamically loaded data.
Demo source