diff --git a/content/docs/platform/chart-editor/chart-types/area.mdx b/content/docs/platform/chart-editor/chart-types/area.mdx
new file mode 100644
index 0000000..e3d5a10
--- /dev/null
+++ b/content/docs/platform/chart-editor/chart-types/area.mdx
@@ -0,0 +1,27 @@
+---
+title: Area
+description: Show how values change over time with the volume filled in
+icon: ChartArea
+---
+
+An area chart works like a [line chart](/platform/chart-editor/chart-types/line), but fills the space below each line. It makes volume easier to see, for example total traffic over a month.
+
+
+
+## Building an area chart
+
+Build it the same way as a line chart:
+
+- **Easy mode:** set **Show** to an interval. Each series, or each group of a **Breakdown**, becomes an area.
+- **Canvas mode:** add a **Time Group** node to each pipeline. Each Output node becomes an area.
+
+**Running total** works the same as on line charts.
+
+## Display options
+
+| Option | Default | Description |
+| ----------------- | -------- | --------------------------------------------------------------- |
+| Logarithmic Scale | Off | Spaces the value axis by orders of magnitude |
+| Line Style | Monotone | **Monotone** (smooth), **Linear** (straight lines), or **Step** |
+
+Area charts also support [Values](/platform/chart-editor/chart-types#values) settings and [Event markers](/platform/chart-editor/chart-types#event-markers).
diff --git a/content/docs/platform/chart-editor/chart-types/bar.mdx b/content/docs/platform/chart-editor/chart-types/bar.mdx
new file mode 100644
index 0000000..5ae6a61
--- /dev/null
+++ b/content/docs/platform/chart-editor/chart-types/bar.mdx
@@ -0,0 +1,26 @@
+---
+title: Bar
+description: Compare values over time or between groups
+icon: ChartColumn
+---
+
+A bar chart compares values, either over time (one bar per day, for example) or between groups (one bar per version or platform).
+
+
+
+## Building a bar chart
+
+- **Over time:** in Easy mode, set **Show** to an interval. In Canvas mode, add a **Time Group** node.
+- **By group:** in Easy mode, leave **Show** on **Total** and pick a **Breakdown**. In Canvas mode, add a **Group By** node.
+
+Add more series (or Output nodes) to show several values per bar. See [Stacked bar charts](/platform/chart-editor/output-nodes#stacked-bar-charts).
+
+## Display options
+
+| Option | Default | Description |
+| ----------------- | -------- | ---------------------------------------------------------------------- |
+| Logarithmic Scale | Off | Spaces the value axis by orders of magnitude |
+| Orientation | Vertical | **Vertical** bars, or **Horizontal** bars for long group names |
+| Stack Series | On | On: series are stacked in each bar. Off: series are drawn side by side |
+
+Bar charts also support [Values](/platform/chart-editor/chart-types#values) settings (unit, decimals, axis range, thresholds).
diff --git a/content/docs/platform/chart-editor/chart-types/heatmap.mdx b/content/docs/platform/chart-editor/chart-types/heatmap.mdx
new file mode 100644
index 0000000..2fc7944
--- /dev/null
+++ b/content/docs/platform/chart-editor/chart-types/heatmap.mdx
@@ -0,0 +1,30 @@
+---
+title: Heatmap
+description: Show intensity in a grid, like activity by hour and day
+icon: Grid3x3
+---
+
+A heatmap colors each cell by its value, from quiet to busy. It's useful for spotting patterns, like the busiest hours of the week.
+
+
+
+## Layouts
+
+The heatmap picks its layout from the shape of your data:
+
+| Layout | Easy mode | Canvas mode |
+| ---------------------------------------------------------------- | ----------------------------------------------------------------------- | --------------------------------------------------------------------- |
+| **Calendar:** one column per day, one row per hour | One series, **Show** set to **Hour**, over a time range of several days | One pipeline with a **Time Group** node set to hours |
+| **Grid:** one row per series, one column per group | Several series, a **Breakdown**, and **Show** on **Total** | Several Output nodes, each with a **Group By** node on the same field |
+| **Grid:** the first field is the rows, the second is the columns | — | A **Group By** node with two fields |
+| **Mosaic:** one tile per group | One series, a **Breakdown**, and **Show** on **Total** | One pipeline with a **Group By** node on one field |
+
+
+
+In grid layouts, empty rows and columns are hidden and the busiest rows are shown first. Hover a cell to see its exact value.
+
+## Display options
+
+| Option | Default | Description |
+| ----------- | ------- | ---------------------------------------------- |
+| Show Legend | On | Shows a color scale from **Quiet** to **Busy** |
diff --git a/content/docs/platform/chart-editor/chart-types/index.mdx b/content/docs/platform/chart-editor/chart-types/index.mdx
new file mode 100644
index 0000000..88649da
--- /dev/null
+++ b/content/docs/platform/chart-editor/chart-types/index.mdx
@@ -0,0 +1,76 @@
+---
+title: Overview
+description: Every chart type in FastStats and when to use it
+icon: Shapes
+---
+
+Pick the chart type in the chart editor, next to the preview. You can change it at any time, and the same data is drawn in the new style.
+
+## Choosing a chart type
+
+| Chart type | Best for |
+| ----------------------------------------------------- | --------------------------------------------------------- |
+| [Widget](/platform/chart-editor/chart-types/widget) | One or more headline numbers with a trend |
+| [Line](/platform/chart-editor/chart-types/line) | Trends over time |
+| [Area](/platform/chart-editor/chart-types/area) | Trends over time, with the volume filled in |
+| [Bar](/platform/chart-editor/chart-types/bar) | Comparing values over time or by group |
+| [Pie](/platform/chart-editor/chart-types/pie) | How a total splits into a few groups |
+| [List](/platform/chart-editor/chart-types/list) | Ranked values, like top pages or versions |
+| [Table](/platform/chart-editor/chart-types/table) | Several metrics side by side for each group |
+| [Map](/platform/chart-editor/chart-types/map) | Values per country |
+| [Treemap](/platform/chart-editor/chart-types/treemap) | Share of a total, as rectangles sized by value |
+| [Heatmap](/platform/chart-editor/chart-types/heatmap) | Activity by hour and day, or across two groupings |
+| [Radar](/platform/chart-editor/chart-types/radar) | Comparing series across several categories at once |
+| [Scatter](/platform/chart-editor/chart-types/scatter) | Values plotted against a numeric grouping like Core Count |
+
+## Over time or as a total
+
+Some chart types plot values over time, others show one value per group.
+
+- **Line** and **area** charts always use a time interval. In Easy mode, switching to one of them sets **Show** to **Auto**.
+- **Pie**, **list**, **map**, and **treemap** charts always show a total per group. In Easy mode, switching to one of them sets **Show** to **Total**.
+- **Bar**, **widget**, and **table** charts keep whatever you picked.
+
+In Canvas mode, a **Time Group** node puts a chart on a time axis, and a **Group By** node splits it into groups.
+
+## Shared options
+
+### Values
+
+Line, area, and bar charts have a **Values** section in the chart editor that controls how numbers are shown on the value axis and in tooltips.
+
+| Setting | Description |
+| -------------- | --------------------------------------------------------------------------------------------------------- |
+| Unit | Number, Percent (0–100), Percent (0–1), Duration (ms), Duration (s), Bytes, or a custom unit like `req/s` |
+| Decimal places | **Auto**, or a fixed number from 0 to 4 |
+| Axis range | A fixed minimum and maximum for the value axis. Leave empty to scale automatically |
+| Thresholds | Up to 6 labeled lines at a value, like a goal, budget, or limit. Pick a color for each one |
+
+
+
+
+
+### Event markers
+
+Line and area charts can show **Event Markers**: labeled points in time like launches, releases, or milestones. Turn on the marker collections you want under **Event Markers** in the chart editor.
+
+
+
+### Legend
+
+Charts with more than one series show a legend. Click an entry to hide or show that series. Hold Shift or Alt while clicking to show only that series, and do it again to bring the others back. Hidden series are remembered in your browser.
+
+
+
+### Logarithmic scale
+
+Line, area, bar, radar, and scatter charts have a **Logarithmic Scale** toggle. It spaces the value axis by orders of magnitude, which helps when one series is much larger than another.
diff --git a/content/docs/platform/chart-editor/chart-types/line.mdx b/content/docs/platform/chart-editor/chart-types/line.mdx
new file mode 100644
index 0000000..84fa7bb
--- /dev/null
+++ b/content/docs/platform/chart-editor/chart-types/line.mdx
@@ -0,0 +1,26 @@
+---
+title: Line
+description: Show how values change over time
+icon: ChartLine
+---
+
+A line chart plots values over time. Use it to follow trends like player counts, page views, or error rates.
+
+
+
+## Building a line chart
+
+- **Easy mode:** set **Show** to an interval (**Auto**, **Minute**, **Hour**, **Day**, **Week**, or **Month**). Each series becomes a line. Pick a **Breakdown** to draw one line per group instead, for example one line per game version.
+- **Canvas mode:** add a **Time Group** node to each pipeline. Each Output node becomes a line. See [Output & Multi-Series](/platform/chart-editor/output-nodes#multi-line-charts).
+
+Turn on **Running total** in Easy mode (or **Cumulative** on the Time Group node) to make each point add up every point before it.
+
+## Display options
+
+| Option | Default | Description |
+| ----------------- | -------- | --------------------------------------------------------------- |
+| Logarithmic Scale | Off | Spaces the value axis by orders of magnitude |
+| Line Style | Monotone | **Monotone** (smooth), **Linear** (straight lines), or **Step** |
+| Show Dots | Off | Draws a dot at every data point |
+
+Line charts also support [Values](/platform/chart-editor/chart-types#values) settings (unit, decimals, axis range, thresholds) and [Event markers](/platform/chart-editor/chart-types#event-markers).
diff --git a/content/docs/platform/chart-editor/chart-types/list.mdx b/content/docs/platform/chart-editor/chart-types/list.mdx
new file mode 100644
index 0000000..b558ba1
--- /dev/null
+++ b/content/docs/platform/chart-editor/chart-types/list.mdx
@@ -0,0 +1,37 @@
+---
+title: List
+description: Show ranked values, like top pages or versions
+icon: List
+---
+
+A list chart shows one row per group with its value and a bar, sorted from highest to lowest. Use it for rankings like top pages, referrers, countries, or plugin versions.
+
+
+
+## Building a list
+
+- **Easy mode:** pick a **Breakdown**. Each group becomes a row.
+- **Canvas mode:** add a **Group By** node before the **Output** node.
+
+## Tabs
+
+With more than one series (or Output node), each one becomes a tab, for example "Browsers" and "Countries". Click a tab or swipe on the card to switch between them. See [Tabbed lists](/platform/chart-editor/output-nodes#tabbed-lists).
+
+## Using a list on the dashboard
+
+- **Sorting:** click a column header to sort by it. Click again to flip the order.
+- **View all:** the card shows as many rows as fit. Click **View all** to open every row in a dialog, where you can also search.
+- **Icons:** rows can show icons, such as browser logos or country flags, by setting an **Icon set** on the Output node.
+- **Nested rows:** with **Nest by** on the Output node, related rows are grouped together and you can open a group to see what's inside.
+- **Filtering:** if you can manage the project, click a row to filter the whole dashboard to that value.
+
+
diff --git a/content/docs/platform/chart-editor/chart-types/map.mdx b/content/docs/platform/chart-editor/chart-types/map.mdx
new file mode 100644
index 0000000..9a5c690
--- /dev/null
+++ b/content/docs/platform/chart-editor/chart-types/map.mdx
@@ -0,0 +1,35 @@
+---
+title: Map
+description: Show values per country on a world map
+icon: Globe
+---
+
+A map chart shades each country by its value, so you can see at a glance where your servers or visitors are.
+
+
+
+## Building a map
+
+Group by a country field. Each group must be a two-letter country code (like `DE` or `US`), which is what the built-in country fields contain.
+
+- **Easy mode:** pick a country field as the **Breakdown**.
+- **Canvas mode:** add a **Group By** node on a country field before the **Output** node.
+
+A map shows one series. If there are several, it uses the first one.
+
+## Using a map on the dashboard
+
+- Countries with higher values are shaded more strongly. Hover a country to see its name and value.
+- Use the zoom buttons to zoom in and out, and drag to move around.
+- Open the map in fullscreen to also see a list of all countries, sorted by value.
+
+
diff --git a/content/docs/platform/chart-editor/chart-types/meta.json b/content/docs/platform/chart-editor/chart-types/meta.json
new file mode 100644
index 0000000..ba80030
--- /dev/null
+++ b/content/docs/platform/chart-editor/chart-types/meta.json
@@ -0,0 +1,18 @@
+{
+ "title": "Chart Types",
+ "icon": "Shapes",
+ "pages": [
+ "widget",
+ "line",
+ "area",
+ "bar",
+ "pie",
+ "list",
+ "table",
+ "map",
+ "treemap",
+ "heatmap",
+ "radar",
+ "scatter"
+ ]
+}
diff --git a/content/docs/platform/chart-editor/chart-types/pie.mdx b/content/docs/platform/chart-editor/chart-types/pie.mdx
new file mode 100644
index 0000000..430cbef
--- /dev/null
+++ b/content/docs/platform/chart-editor/chart-types/pie.mdx
@@ -0,0 +1,41 @@
+---
+title: Pie
+description: Show how a total splits into groups
+icon: ChartPie
+---
+
+A pie chart shows how a total is split between groups, for example the share of servers on each platform. It works best with a handful of groups.
+
+
+
+## Building a pie chart
+
+- **Easy mode:** pick a **Breakdown**. Each group becomes a slice. Use **Top _n_ values** and **Group the rest as Other** to keep the number of slices small.
+- **Canvas mode:** add a **Group By** node before the **Output** node.
+
+Without a breakdown, each series becomes its own slice instead.
+
+## Display options
+
+| Option | Default | Description |
+| ----------------- | ------------- | --------------------------------------------------------------------------------------------------- |
+| Chart Style | Donut | **Donut** (with a hole in the center) or a solid **Pie** |
+| Show Center Value | On | Shows a value in the middle of the donut. Donut style only |
+| Center Value Type | Sum of Values | **Sum of Values** shows the total of all slices. **Category Count** shows how many slices there are |
+| Show Legend | On | Shows a color-coded legend below the chart |
+| Show Slice Labels | Off | Shows a label with a line pointing to each slice |
+
+## Drilling down
+
+If the Output node uses **Nest by**, for example to split `java/17` into `java` and `17`, slices are grouped by the first part. Click a slice to see the values inside it, and use the back button to return to all categories. See [Output settings](/platform/chart-editor/output-nodes#output-settings).
+
+
diff --git a/content/docs/platform/chart-editor/chart-types/radar.mdx b/content/docs/platform/chart-editor/chart-types/radar.mdx
new file mode 100644
index 0000000..3f2efa3
--- /dev/null
+++ b/content/docs/platform/chart-editor/chart-types/radar.mdx
@@ -0,0 +1,24 @@
+---
+title: Radar
+description: Compare series across several categories at once
+icon: Radar
+---
+
+A radar chart draws one spoke per category and connects each series' values into a shape. Use it to compare a few series across the same categories, for example two plugin versions across several platforms.
+
+
+
+## Building a radar chart
+
+- **Easy mode:** add a series for each shape you want to compare, pick a **Breakdown**, and leave **Show** on **Total**. Each group of the breakdown becomes a spoke.
+- **Canvas mode:** build one pipeline per series, each ending in an **Output** node, and add a **Group By** node on the same field to each pipeline.
+
+## Display options
+
+| Option | Default | Description |
+| ----------------- | ------- | ----------------------------------------------------------------------- |
+| Logarithmic Scale | Off | Spaces the value axis by orders of magnitude |
+| Show Dots | On | Draws a dot at each data point |
+| Fill Opacity | Medium | How strongly each shape is filled: None, Light, Medium, Heavy, or Solid |
+| Show Legend | On | Shows a legend when there is more than one series |
+| Grid Shape | Polygon | Shape of the background grid: **Polygon** or **Circle** |
diff --git a/content/docs/platform/chart-editor/chart-types/scatter.mdx b/content/docs/platform/chart-editor/chart-types/scatter.mdx
new file mode 100644
index 0000000..5e18704
--- /dev/null
+++ b/content/docs/platform/chart-editor/chart-types/scatter.mdx
@@ -0,0 +1,24 @@
+---
+title: Scatter
+description: Plot values against a grouping like Core Count
+icon: ChartScatter
+---
+
+A scatter chart draws a point for each value instead of connecting them. Use it to see how a value relates to something numeric, for example how player count relates to Core Count.
+
+
+
+## Building a scatter chart
+
+- **Against a grouping:** in Easy mode, pick a **Breakdown** (for example Core Count) and leave **Show** on **Total**. In Canvas mode, add a **Group By** node. Each group becomes a position on the horizontal axis.
+- **Over time:** in Easy mode, set **Show** to an interval. In Canvas mode, add a **Time Group** node. Points are placed along a time axis.
+
+Each series (or Output node) becomes its own set of points with its own color.
+
+## Display options
+
+| Option | Default | Description |
+| ----------------- | ------- | ------------------------------------------------- |
+| Logarithmic Scale | Off | Spaces the value axis by orders of magnitude |
+| Point Size | Medium | **Small**, **Medium**, or **Large** |
+| Show Legend | On | Shows a legend when there is more than one series |
diff --git a/content/docs/platform/chart-editor/chart-types/table.mdx b/content/docs/platform/chart-editor/chart-types/table.mdx
new file mode 100644
index 0000000..9041a9e
--- /dev/null
+++ b/content/docs/platform/chart-editor/chart-types/table.mdx
@@ -0,0 +1,77 @@
+---
+title: Table
+description: Show grouped data as rows with one sortable column per metric
+icon: Table2
+---
+
+A table chart shows one row per group, for example one row per game version or country, and one column for each metric. Use it to compare several numbers side by side, like unique servers and total events for every version.
+
+
+
+## Creating a table
+
+In the chart editor, set the chart type to **Table**. Tables work in both editor modes.
+
+### In Easy mode
+
+1. Add a series for each column you want. Each [series](/platform/chart-editor/easy-mode#series) becomes one column.
+2. Under **Breakdown**, pick the field that each row stands for, such as **Game Version**.
+3. Set **Top _n_ values** to choose how many rows to show, and turn on **Group the rest as Other** to sum up everything else into one row.
+4. Give each series a name. The names become the column headers.
+
+Without a breakdown, the table shows a single row with one total per column.
+
+
+
+### In Canvas mode
+
+Each [Output node](/platform/chart-editor/output-nodes) becomes one column. Group every pipeline by the same field with a **Group By** node, so the values for each group line up in the same row.
+
+1. Build one pipeline per column, each ending in a named **Output** node
+2. Add a **Group By** node on the same field to every pipeline
+3. Aggregate each pipeline, for example `count` in one and `distinct` in another
+4. Place the Output nodes left to right in the order you want the columns
+
+
+ A pipeline without a **Group By** node has nothing to split into rows, so the
+ table shows a single row for it.
+
+
+## Columns and rows
+
+| Part | Where it comes from |
+| -------------- | ---------------------------------------------------------------------------------- |
+| First column | The field you group by. Its header is the field name, for example "Game Version" |
+| Metric columns | One per series or Output node. Unnamed columns are called "Value", "Value 2", etc. |
+| Rows | One per group. Groups with no value are shown as "(empty)" |
+
+Row labels get twice the width of a metric column, and the table always fits the width of its card, so you never have to scroll sideways.
+
+When you group by country, each row gets a flag icon automatically. Other fields show icons if the Output node has an icon set.
+
+## Display options
+
+Under **Display** in the chart editor:
+
+| Option | Default | Description |
+| ---------- | ------- | ------------------------------------------------------------------ |
+| Value Bars | On | Shades each metric cell by its share of the column's largest value |
+| Totals Row | Off | Adds a last row that sums every metric column |
+
+
+
+## Using a table on the dashboard
+
+### Sorting
+
+Click a column header to sort by it, and click it again to flip the order. Tables start sorted by the first metric column, highest value first. Metric columns sort highest first on the first click, and the row label column sorts A to Z.
+
+### Pages
+
+If there are more rows than fit in the card, the table splits them into pages. Use the arrows below the table to move between pages. Make the card taller on the dashboard to show more rows at once, or open the table in fullscreen.
+
+
+
+### Filtering the dashboard
+
+If you can manage the project, click a row label to filter the whole dashboard to that value. For example, clicking `1.21.11` in a table grouped by Game Version filters every chart to that version. While no description is set, the table shows a hint like "Click a game version to filter the dashboard." under its name.
diff --git a/content/docs/platform/chart-editor/chart-types/treemap.mdx b/content/docs/platform/chart-editor/chart-types/treemap.mdx
new file mode 100644
index 0000000..a4ecb07
--- /dev/null
+++ b/content/docs/platform/chart-editor/chart-types/treemap.mdx
@@ -0,0 +1,20 @@
+---
+title: Treemap
+description: Show the share of a total as rectangles sized by value
+icon: LayoutDashboard
+---
+
+A treemap shows each group as a rectangle sized by its value. Like a [pie chart](/platform/chart-editor/chart-types/pie), it shows how a total splits into parts, but it stays readable with many more groups.
+
+
+
+## Building a treemap
+
+- **Easy mode:** pick a **Breakdown**. Each group becomes a rectangle.
+- **Canvas mode:** add a **Group By** node before the **Output** node.
+
+Without a breakdown, each series becomes its own rectangle instead.
+
+Only positive values are shown. Groups with a value of zero or less are left out.
+
+A treemap has no extra display options.
diff --git a/content/docs/platform/chart-editor/chart-types/widget.mdx b/content/docs/platform/chart-editor/chart-types/widget.mdx
new file mode 100644
index 0000000..5b1fa71
--- /dev/null
+++ b/content/docs/platform/chart-editor/chart-types/widget.mdx
@@ -0,0 +1,26 @@
+---
+title: Widget
+description: Show one or more headline numbers with a trend
+icon: TrendingUp
+---
+
+A widget shows a single number, such as the current server count or total page views, with how much it changed compared with the previous period.
+
+
+
+## Building a widget
+
+A widget shows the total of each series over the dashboard's time range.
+
+- **Easy mode:** add a series and pick a **Measure**. Leave **Show** on **Total**.
+- **Canvas mode:** connect a **Data Source** to an **Aggregate** node and an **Output** node.
+
+## Multiple values
+
+Add more series (or Output nodes) to show several values next to each other in one widget. Each value is labeled with its series name and gets its own trend.
+
+
+
+## Trend
+
+Below the value, the widget shows the change compared with the previous period of the same length, for example "+1.5% vs previous 24h". Increases are shown in green, decreases in red.
diff --git a/content/docs/platform/chart-editor/easy-mode.mdx b/content/docs/platform/chart-editor/easy-mode.mdx
index 5d892d7..c2baff9 100644
--- a/content/docs/platform/chart-editor/easy-mode.mdx
+++ b/content/docs/platform/chart-editor/easy-mode.mdx
@@ -8,7 +8,7 @@ import { Callout } from "fumadocs-ui/components/callout";
Easy mode lets you build a chart by filling out a short form instead of wiring nodes together. Pick what to measure, add filters and a breakdown, and pick a chart type. The preview updates while you work.
-It works with every chart type and also supports charts with more than one series.
+It works with every chart type and also supports charts with more than one series. See [Chart Types](/platform/chart-editor/chart-types) for what each one does.

@@ -19,6 +19,17 @@ It works with every chart type and also supports charts with more than one serie

+
+
### Making Easy the default
Canvas is still the default mode for new charts. To open charts in Easy mode by default, go to your **Appearance** settings and change the chart editor mode under **Workspace**.
@@ -27,6 +38,17 @@ Canvas is still the default mode for new charts. To open charts in Easy mode by
The left panel defines **what data** the chart shows. The right side controls **how it looks**.
+
+
### Series
A series is one value or line in your chart. Each series gets a letter (**A**, **B**, ...) and a title that shows its data source and measure, for example "All events · Unique servers".
@@ -66,7 +88,14 @@ Filters in the **Filters** section apply to every series in the chart. Click **A
### Chart type and value
-At the top of the preview, choose the **chart type** and use **Show** to pick which value the chart displays (for example, **Total**). The preview updates right away.
+At the top of the preview, choose the **chart type** and use **Show** to pick how values are grouped over time:
+
+- **Total** shows one value per series (or per group, with a breakdown) for the whole time range.
+- **Auto**, **Minute**, **Hour**, **Day**, **Week**, or **Month** puts the chart on a time axis with one point per interval. **Auto** picks an interval that fits the time range.
+
+With an interval selected, turn on **Running total** to make each point add up every point before it.
+
+
Widgets also compare the current value with the previous period, for example "+1.9% vs previous 24h".
diff --git a/content/docs/platform/chart-editor/flow-nodes.mdx b/content/docs/platform/chart-editor/flow-nodes.mdx
index ceb4250..04bcb50 100644
--- a/content/docs/platform/chart-editor/flow-nodes.mdx
+++ b/content/docs/platform/chart-editor/flow-nodes.mdx
@@ -26,6 +26,17 @@ The Flow Editor lets you build chart queries by connecting nodes in a pipeline.
2. Connect transformation nodes like **Filter**, **Group By**, or **Aggregate** to shape the data
3. Finish with an **Output** node to produce the chart result
+
+
Each node has handles on its top and/or bottom edge. Connect the bottom handle of one node to the top handle of the next to build the pipeline. The colored badge on each node shows its category. Sources, filters, aggregates, groupings, transforms, time operations, and outputs each have their own color.
## Nodes
diff --git a/content/docs/platform/chart-editor/index.mdx b/content/docs/platform/chart-editor/index.mdx
index 8b13dfc..b4d9853 100644
--- a/content/docs/platform/chart-editor/index.mdx
+++ b/content/docs/platform/chart-editor/index.mdx
@@ -6,7 +6,7 @@ icon: ChartArea
import { Cards, Card } from "fumadocs-ui/components/card";
-The Chart Editor is where you build charts in fastStats. It has two modes, which you switch between in the top left of the editor:
+The Chart Editor is where you build charts in FastStats. It has two modes, which you switch between in the top left of the editor:
- **Easy:** build a chart from a simple form. Pick a measure, add filters and a breakdown, and choose a chart type.
- **Canvas:** connect nodes on a canvas to choose your data, transform it, and decide how it shows up in the chart.
@@ -26,6 +26,9 @@ The Chart Editor is where you build charts in fastStats. It has two modes, which
How tabs, multi-line charts, and stacked bars work when you add more than
one Output node.
+
+ Every chart type, what data it needs, and its display options.
+
## How it works
diff --git a/content/docs/platform/chart-editor/meta.json b/content/docs/platform/chart-editor/meta.json
index b4a3f18..a5d73cd 100644
--- a/content/docs/platform/chart-editor/meta.json
+++ b/content/docs/platform/chart-editor/meta.json
@@ -1,3 +1,4 @@
{
- "title": "Chart Editor"
+ "title": "Chart Editor",
+ "pages": ["index", "easy-mode", "flow-nodes", "output-nodes", "chart-types"]
}
diff --git a/public/images/chart-editor/chart-types/area.png b/public/images/chart-editor/chart-types/area.png
new file mode 100644
index 0000000..c9073c6
Binary files /dev/null and b/public/images/chart-editor/chart-types/area.png differ
diff --git a/public/images/chart-editor/chart-types/bar-stacked.png b/public/images/chart-editor/chart-types/bar-stacked.png
new file mode 100644
index 0000000..8ab7ed0
Binary files /dev/null and b/public/images/chart-editor/chart-types/bar-stacked.png differ
diff --git a/public/images/chart-editor/chart-types/event-markers.png b/public/images/chart-editor/chart-types/event-markers.png
new file mode 100644
index 0000000..fb86d4a
Binary files /dev/null and b/public/images/chart-editor/chart-types/event-markers.png differ
diff --git a/public/images/chart-editor/chart-types/heatmap-calendar.png b/public/images/chart-editor/chart-types/heatmap-calendar.png
new file mode 100644
index 0000000..434903f
Binary files /dev/null and b/public/images/chart-editor/chart-types/heatmap-calendar.png differ
diff --git a/public/images/chart-editor/chart-types/heatmap-mosaic.png b/public/images/chart-editor/chart-types/heatmap-mosaic.png
new file mode 100644
index 0000000..2ba9a28
Binary files /dev/null and b/public/images/chart-editor/chart-types/heatmap-mosaic.png differ
diff --git a/public/images/chart-editor/chart-types/line.png b/public/images/chart-editor/chart-types/line.png
new file mode 100644
index 0000000..e1fe377
Binary files /dev/null and b/public/images/chart-editor/chart-types/line.png differ
diff --git a/public/images/chart-editor/chart-types/list.png b/public/images/chart-editor/chart-types/list.png
new file mode 100644
index 0000000..b56f99a
Binary files /dev/null and b/public/images/chart-editor/chart-types/list.png differ
diff --git a/public/images/chart-editor/chart-types/map.png b/public/images/chart-editor/chart-types/map.png
new file mode 100644
index 0000000..1dc91ec
Binary files /dev/null and b/public/images/chart-editor/chart-types/map.png differ
diff --git a/public/images/chart-editor/chart-types/pie-donut.png b/public/images/chart-editor/chart-types/pie-donut.png
new file mode 100644
index 0000000..e0e7323
Binary files /dev/null and b/public/images/chart-editor/chart-types/pie-donut.png differ
diff --git a/public/images/chart-editor/chart-types/radar.png b/public/images/chart-editor/chart-types/radar.png
new file mode 100644
index 0000000..7cc94b5
Binary files /dev/null and b/public/images/chart-editor/chart-types/radar.png differ
diff --git a/public/images/chart-editor/chart-types/scatter.png b/public/images/chart-editor/chart-types/scatter.png
new file mode 100644
index 0000000..0df0f6c
Binary files /dev/null and b/public/images/chart-editor/chart-types/scatter.png differ
diff --git a/public/images/chart-editor/chart-types/table-dashboard.png b/public/images/chart-editor/chart-types/table-dashboard.png
new file mode 100644
index 0000000..09c8ff8
Binary files /dev/null and b/public/images/chart-editor/chart-types/table-dashboard.png differ
diff --git a/public/images/chart-editor/chart-types/table-paging.png b/public/images/chart-editor/chart-types/table-paging.png
new file mode 100644
index 0000000..78d4440
Binary files /dev/null and b/public/images/chart-editor/chart-types/table-paging.png differ
diff --git a/public/images/chart-editor/chart-types/thresholds.png b/public/images/chart-editor/chart-types/thresholds.png
new file mode 100644
index 0000000..d73b514
Binary files /dev/null and b/public/images/chart-editor/chart-types/thresholds.png differ
diff --git a/public/images/chart-editor/chart-types/treemap.png b/public/images/chart-editor/chart-types/treemap.png
new file mode 100644
index 0000000..0ad1fff
Binary files /dev/null and b/public/images/chart-editor/chart-types/treemap.png differ
diff --git a/public/images/chart-editor/chart-types/values-section.png b/public/images/chart-editor/chart-types/values-section.png
new file mode 100644
index 0000000..fcefd9a
Binary files /dev/null and b/public/images/chart-editor/chart-types/values-section.png differ
diff --git a/public/images/chart-editor/chart-types/widget.png b/public/images/chart-editor/chart-types/widget.png
new file mode 100644
index 0000000..38cce56
Binary files /dev/null and b/public/images/chart-editor/chart-types/widget.png differ
diff --git a/public/images/chart-editor/easy-mode/easy-show-interval.png b/public/images/chart-editor/easy-mode/easy-show-interval.png
new file mode 100644
index 0000000..fa4cf9d
Binary files /dev/null and b/public/images/chart-editor/easy-mode/easy-show-interval.png differ
diff --git a/public/videos/chart-editor/canvas-connect-nodes.mp4 b/public/videos/chart-editor/canvas-connect-nodes.mp4
new file mode 100644
index 0000000..646e82a
Binary files /dev/null and b/public/videos/chart-editor/canvas-connect-nodes.mp4 differ
diff --git a/public/videos/chart-editor/easy-build-chart.mp4 b/public/videos/chart-editor/easy-build-chart.mp4
new file mode 100644
index 0000000..1f99f88
Binary files /dev/null and b/public/videos/chart-editor/easy-build-chart.mp4 differ
diff --git a/public/videos/chart-editor/easy-to-canvas.mp4 b/public/videos/chart-editor/easy-to-canvas.mp4
new file mode 100644
index 0000000..26d2a52
Binary files /dev/null and b/public/videos/chart-editor/easy-to-canvas.mp4 differ
diff --git a/public/videos/chart-editor/legend-toggle.mp4 b/public/videos/chart-editor/legend-toggle.mp4
new file mode 100644
index 0000000..ff8ff78
Binary files /dev/null and b/public/videos/chart-editor/legend-toggle.mp4 differ
diff --git a/public/videos/chart-editor/list-view-all.mp4 b/public/videos/chart-editor/list-view-all.mp4
new file mode 100644
index 0000000..57e06e9
Binary files /dev/null and b/public/videos/chart-editor/list-view-all.mp4 differ
diff --git a/public/videos/chart-editor/map-zoom.mp4 b/public/videos/chart-editor/map-zoom.mp4
new file mode 100644
index 0000000..61005e3
Binary files /dev/null and b/public/videos/chart-editor/map-zoom.mp4 differ
diff --git a/public/videos/chart-editor/pie-drilldown.mp4 b/public/videos/chart-editor/pie-drilldown.mp4
new file mode 100644
index 0000000..8e3cbe6
Binary files /dev/null and b/public/videos/chart-editor/pie-drilldown.mp4 differ