---
title: "Charts"
id: "1753"
type: "page"
slug: "charts"
published_at: "2026-09-20T21:16:34+00:00"
modified_at: "2026-09-21T01:36:28+00:00"
url: "https://xedant.com/agents/analytics/docs/charts"
markdown_url: "https://xedant.com/agents/analytics/docs/charts.md"
excerpt: "Charts are built on ECharts. There are 28 chart types in total — from the…"
---

# Charts

[https://xedant.com/agents/analytics/docs/charts.md](https://xedant.com/agents/analytics/docs/charts.md)

Charts are built on ECharts. There are 28 chart types in total — from the familiar lines and bars to funnels, maps and relationship diagrams. Data comes from SQL queries to the connected sources, and the look is tuned with styling overrides.

## Lines and bars

- **Line chart** (`LineChartContent`) — how a value changes over time: revenue, traffic, price. Multiple series are supported, plus smoothing, area fill under the line, steps for “sits still, then jumps” patterns (tariffs, stock levels) and normalizing curves of different scales to 100;
- **Bar chart** (`BarChartContent`) — comparing categories side by side: channels, products, regions. Bars stack into stacks, there is a 100-percent stack for composition, sorting and top-N for long lists;
- **Combo chart** (`ComboChartContent`) — bars for one measure and a line for another on two axes with labels: cost and its share, sales volume and average check.

## Comparison: plan against actual

- **Dumbbell chart** (`DumbbellChartContent`) — two points per entity connected by a line: plan and actual, “before” and “after”, forecast and reality. The segment’s length and direction show the gap, labels show the size of the difference: handy for comparing suppliers, managers, marketplaces;
- **Bullet chart** (`BulletChartContent`) — a value bar against a target marker and colored tolerance bands: does the metric fit the norm. The color itself depends on whether higher or lower than target is better;
- **Slope chart** (`SlopeChartContent`) — one line per entity between two periods: how a ranking or value changed. Falling lines are red, rising are green — you see both overtaking and swapping places;
- **Pareto chart** (`ParetoChartContent`) — categories in descending order with a cumulative share line: how few positions produce most of the losses or revenue. The dashed marker sits at 80% by default.

## Composition, shares and flows

- **Doughnut chart** (`DoughnutChartContent`) — shares of a whole: inner and outer radius, legend, and a rose-chart mode that makes small sectors readable;
- **Treemap** (`TreemapChartContent`) — shares of a whole as rectangles: an honest replacement for the pie when there are many parts and sectors become indistinguishable. A parent column nests categories into each other, and a “sunburst” mode lays the same tree out as rings;
- **Waterfall chart** (`WaterfallChartContent`) — what the total is made of: price → discounts → commissions → profit. Every bar is a signed step, the last one shows the total;
- **Flow diagram** (`SankeyChartContent`) — where money or goods flow: ribbon width equals volume. If the data forms a cycle, the chart tells you honestly instead of drawing a broken picture.

## Distributions

- **Histogram** (`HistogramChartContent`) — how the values of one numeric column are distributed: where the bulk is and where the long tail is. The calculation runs on the server (`POST /api/query/histogram`) — the data is not shipped to the browser in full;
- **Box plot** (`BoxPlotChartContent`) — median, quartiles and outliers: compare spread between groups. Quartiles are computed on the server (`POST /api/query/boxplot`);
- **Violin plot** (`ViolinChartContent`) — the full distribution shape per group: two humps, a queue, a heavy tail — the things a box plot doesn’t show. A “bee swarm” mode draws one point per observation;
- **Heatmap** (`HeatmapContent`) — value density across two columns: every cell is colored by magnitude;
- **Calendar heatmap** (`CalendarHeatmapContent`) — every day in a calendar cell, colored by value: the daily rhythm (spikes on weekdays, quiet weekends) that a monthly summary erases.

## Funnels, schedules and sensitivity

- **Funnel** (`FunnelChartContent`) — stages as narrowing bands: how many people reach each step and how many are lost in between (views → cart → order). The stage order comes from the query;
- **Gantt chart** (`GanttChartContent`) — “from date to date” bars on each row, with a vertical marker for today: seasonal windows, delivery plans, return deadlines. A state column sets the bar color;
- **Tornado chart** (`TornadoChartContent`) — which factor moves the result the most: a bar per factor shows the outcome at its worst and best value. The most influential one is on top.

## Profiles and geography

- **Radar chart** (`RadarChartContent`) — an object’s profile across 3–8 criteria: candidates are compared not by table rows but by shape. The area can be filled with color;
- **Parallel coordinates** (`ParallelCoordinatesChartContent`) — its own axis per measure, its own line per object: you immediately see who is evenly good and who has a dip in one measure with all the others fine;
- **Venn diagram** (`VennChartContent`) — the overlap of two or three groups: how many customers are shared, how many are unique. The circle area is the group size, the lens is the overlap;
- **Region map** (`MapChartContent`) — the 85 regions of Russia or 176 countries of the world, colored by value: when the story is geographic, the picture is the answer. Region names are matched to the map, and unmatched ones are listed below it.

## Relationships and states

- **Node graph** (`NodeGraphChartContent`) — nodes and edges from a list of connections: who is linked to whom and how tightly (edge thickness). Nodes can be dragged;
- **State timeline** (`StateTimelineChartContent`) — colored intervals per label: when a metric was in which state;
- **Status history** (`StatusHistoryChartContent`) — a grid of cells over time: discrete periods for each label, the whole state tape at once.

Both work well together with alerts: the “calm → pending → firing → recovered” transitions of rules are visible right in the report.

## Financial series and dependencies

- **Candlesticks** (`CandlestickChartContent`) — financial open/high/low/close series with trading volume from your databases;
- **Scatter plot** (`ScatterChartContent`) — the relationship of two numeric columns: price and demand, conversion and spend. A third column sets the point size (`zValueColumn`), a divider column sets the color (`colorColumn`); a trend line shows the direction of the relationship, reference lines show thresholds and bounds.

## Scales and gauges

- **Gauge** (`GaugeContent`) — a metric as a speedometer with lower and upper scale bounds;
- **Bar gauge** (`BarGaugeContent`) — a ranked series of values, each bar colored by thresholds: ratings, norms, a traffic light down a list.

## Shared capabilities

All charts share the same capabilities, whatever the type:

- **Reference lines and bands** — a norm, a target, a tolerance bound: a line at a fixed value, at a statistic of the data itself (median, 10th and 90th percentiles), or at a value from a query column. A band is set by two bounds. The “are we within the norm” check reads off the picture instead of being computed in your head;
- **Annotated events** — a second small table with dates and labels: marker dots and shaded periods appear on the chart — promotions, outages, holidays, a tariff change. The cause of a dip or spike sits right next to it;
- **Intervals** — confidence-interval whiskers on bars and points, a band per series on lines: a pessimistic and an optimistic scenario around the main curve;
- **Value labels and marked points** — numbers right on the chart (when there aren’t many), and outliers get a badge with an explanation: you see both the jump itself and what caused it;
- **Comparison with the past** — a dashed “ghost” line of the same metric a week, a month or a year ago, and moving-average smoothing: the trend is visible while weekly noise stays out of the way;
- **Small multiples** — the same picture per channel, category or warehouse: a row of small charts on a shared scale, so the series are compared honestly;
- **Axis settings** — your own axis label and format, lower and upper bounds, a logarithmic scale, an inverted axis for places and rankings, sorting and top-N with an honest note of how many categories are hidden, and a time axis that leaves gaps instead of squeezing out missing days;
- **Tooltips** — can be extended with query columns: on hover you see not just the value but the context too (for example, the customer count next to the sum), and on a scatter plot the point is labeled by name.

Titles and legends come with every chart, and the look changes without touching the query — through styling overrides: threshold colors, line and point styles, hidden series. Details in the [Styling](/agents/analytics/docs/overrides)
 section.

[← Back to the documentation index](/agents/analytics/docs)