DepthSeries
Try the live demoimport { DepthSeries } from '@wick-charts/react'; <DepthSeries bids={book.bids} asks={book.asks} />Order book chart: cumulative bid and ask size stepping away from the mid price. Plots on a numeric X axis — set axis={{ x: { type: 'numeric' } }} on the container. A new bids / asks array morphs the book on screen.
Renders an order book chart on a numeric price axis — set axis={{ x: { type: 'numeric' } }} on <ChartContainer>. Pass bids and asks as [price, size] levels in any order; the series sorts them and draws cumulative size as two stepped walls, bids left of mid and asks right, with a dashed mid marker and a mid · spread label. The view stays centered on mid: it eases to each new mid, wheel and pinch zoom around mid, and drag-pan is off. A new book morphs from the shape on screen, the walls grow out from mid on the first data, and <Tooltip> shows the hovered side, level price and cumulative size. For level deltas, call chart.updateData(id, { bids?, asks? }) — a size of 0 removes a level.