> For the complete documentation index, see [llms.txt](https://deriverse.gitbook.io/deriverse-v1/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://deriverse.gitbook.io/deriverse-v1/charts-and-market-visualization.md).

# Charts and Market Visualization

The chart area is the central component of the Spot and Perp trading pages, providing real-time data on price action and market liquidity.

### 1. Switching chart modes

Toggle between visualizations using the dropdown menu in the upper-right corner of the chart area.

| Mode            | Description                                                              |
| --------------- | ------------------------------------------------------------------------ |
| **Spot Chart**  | The native Deriverse candlestick chart.                                  |
| **TradingView** | The industry-standard integrated chart for advanced technical analysis.  |
| **Depth Chart** | A visual representation of the orderbook's liquidity.                    |
| **Overview**    | Key market metrics such as 24h volume, funding rates, and token details. |

### 2. Platform Spot Chart (native)

The native Spot Chart is optimized for speed and synchronization with the Deriverse engine.

#### Real-time updates

* **Price action** - the latest price is shown as a dashed horizontal line with a corresponding yellow price label on the right Y-axis.
* **Live candles** - the current candle updates instantly as internal trades occur. At the end of a timeframe boundary (for example, 1m), the candle closes and a new one is created automatically.
* **Consistency** - price changes in the header status panel, chart price line, and Orderbook are synchronized. Any new trade updates all modules instantly.

#### Timeframes and technical overlays

* **Durations** - available candle intervals are **1m, 5m, 15m, 1h, 4h, 1d, and 1w**. Selected durations persist even when switching instruments.
* **Indicators** - toggle independent overlays for Moving Averages (MA1, MA2, MA3), Bollinger Bands (BB), and Volumes.
* **Legend** - hovering the crosshair over any candle displays the OHLC (Open, High, Low, Close) and Volume data in the Legend.
* **Tracking** - toggles the real-time visual markers for the current market price, including the horizontal dashed line and the yellow price label on the right Y-axis.

#### Navigation

* **Zoom and pan** - use your mouse wheel or trackpad to zoom, and click-and-drag to scroll through price history.
* **Scale reset** - if the view is shifted or scaled, click the **Scale reset** button in the upper right to jump back to the latest live candle.

### 3. TradingView integration

The TradingView chart provides an alternative professional environment for users who require a standard toolset for complex charting.

* **Advanced tools** - a wider array of drawing tools (trend lines, Fibonaccis, and more) and a larger library of technical indicators.
* **Customization** - full control over line colors, thickness, and layout settings.

### 4. Depth Chart

The Depth Chart visualizes the cumulative buy and sell interest (liquidity) at different price levels.

* **Visuals** - the Bids (buy-side) area is shaded **green**, and the Asks (sell-side) area is shaded **red**.
* **Interactivity** - hovering the crosshair over the depth area displays a tooltip showing the exact price and cumulative volume at that level.
* **Live liquidity** - the chart updates in near real-time as users place or cancel limit orders in the Orderbook.

{% hint style="success" %}
**Tip:** Your active Limit orders are visually highlighted within the Orderbook (yellow for bids, rose for asks), making it easy to see where your "walls" sit relative to the curves on the Depth Chart.
{% endhint %}