Last updated: 2026 · Reading time ~12 min · Beginner friendly

What it is & why use it

Grist is a modern spreadsheet‑database. A custom widget is simply a web page you embed inside a Grist document. ANUPRESS is that web page — except instead of showing one chart, it gives you a whole mini‑site: a header with your logo and menu, a body of cards and charts organised into tabs, and a footer.

If you can fill in a form, you can build a dashboard with it. There is nothing to install, no account to create, and no server in the middle.

Live, interactive demo

This is the real widget running on sample data — the same thing you’ll get on first load. It cycles through the tabs on its own; click anything to take over and explore. Try the moon/sun icon for dark mode and the Edit button to see the builder (it stays in demo mode here, so nothing is saved).

Tip: the demo includes one of every feature — stat cards, all chart types, a breakdown shown both as a list and a donut, a clustered map, an image hero slider, and a multi‑page menu.

Quick start — 5 steps

1. Open the widget panel in Grist. In your document, add a new widget (or convert a section) and choose the Custom widget type.
2. Paste the URL. In the panel settings, find Enter Custom URL and paste:
   https://anupress.github.io/grist-advanced-charts/
3. Look around the demo. The widget loads with sample data so you can see what’s possible before connecting your own.
4. Click Edit → Accept → Allow full access. ANUPRESS shows a consent screen (explained below), then Grist asks you to grant full document access. This lets it read your tables and save your design.
5. Build & publish. Add blocks, pick your table and columns, then click Save & Publish. Your dashboard reloads automatically next time anyone opens the document.

Permissions & privacy

The first time you click Edit, ANUPRESS shows a short consent screen. It explains, in plain language, exactly what happens next:

• One table is created — ANUPRESS_Config — to store your design (layout, colours, logo).
• Your tables are read so you can chart any column from any table.
• Your design is saved back into that table, so it reloads next time.
• Nothing leaves Grist — there is no ANUPRESS server, no analytics, and no third‑party calls.

After you accept, Grist itself asks you to grant full document access. That is required so the widget can read every table (not just one) and create the config table. You can change or revoke this any time from the widget’s settings panel in Grist.

The editor at a glance

In edit mode a dark bar appears at the top with everything you need:

While editing, hover any block to reveal its drag, edit and delete buttons. Click the header, footer or hero to edit those directly. An Add a block tile sits at the end of every tab.

Building blocks

The body of every page is a grid of blocks. Click Add a block and choose one of five types. Each opens a side panel with a live preview so you see the result as you change settings.

① Stat card (a single KPI)

A big number with an optional trend and a sparkline — e.g. Total Revenue, Headcount.

• Value column — the column to measure. Every column is listed; text columns are marked (text).
• Summarize by — Sum, Average, Count, Distinct count, Min, Max, Median or Std. deviation. Pick a text column and it switches to Count automatically (great for “number of samples”).
• Compare over — optional. Pick a date/order column and the card shows the % change vs the previous period.
• Icon — choose a built‑in icon or upload your own (stored for reuse).
• Number format — compact (1.2K, 3.4M) and a currency symbol.

② Charts

One Chart block, every chart type inside it. You pick the data first, and incompatible chart types grey out automatically — so you can’t build something that doesn’t make sense.

• Categories — the groups along the axis (e.g. Region, Month).
• Values — the numbers to plot (e.g. Revenue). Add a second category to split into series.
• Summarize by — the same aggregations as stat cards.
• Chart type — a grid with a ★ on the recommended type for your columns:

Extra options appear per type: Stack series, Smooth curve, Sort by value, and custom colours (or inherit the theme palette).

③ Breakdown (group‑wise counts)

Counts each distinct value of a column and shows the split with coloured dots, counts and percentages — like “Individual Sex: Male 1,108 (47%) · Female 1,178 (50%) · Empty 29 (1%)”. Empty/blank values get their own row, so it doubles as a quick data‑quality check.

• Group by column — any column.
• Show as — List (the count rows) or a Donut / Pie / Bar / Column chart of the same counts.
• Max rows — anything beyond the limit is rolled into an “Other” row.

④ Map (latitude / longitude)

Plots a pin for every row that has coordinates, on an interactive Leaflet map with marker clustering and Street / Satellite / Terrain layers.

• Latitude / Longitude columns — auto‑detected by name (e.g. sample_latitude), or pick them.
• Popup title — the bold line in each pin’s popup (e.g. a name or code).
• Colour points by — optional category; the legend lists the colours.
• Tooltip fields — choose up to 4 columns to show in the popup (raw lat/long is never shown).

⑤ Text

A heading and a block of text (basic HTML allowed) — for intros, notes or context between charts.

Aggregations in plain English

Dynamic subtitles (write your own, with live numbers)

Every chart, breakdown and map block has a Subtitle field. Type whatever you like, and drop in placeholders that fill in automatically. Click the small (i) next to the field to see which placeholders that block supports.

Hero & slider

Each page can start with a hero — either a gradient banner with your headline, or a full‑width image slideshow (up to 340px tall). The text is fully designable, WordPress‑style:

Show / hide per page Alignment: left / center / right Vertical: top / middle / bottom Headline size S–XL Font: serif / sans / display / mono Text colour

Add images to turn the banner into a slider, give each slide its own caption, and set auto‑play speed. Edit a hero by clicking it, or from Pages → ✦ next to a page.

Pages & menu

Your dashboard can have multiple pages (tabs). The menu switches between them instantly — no page reload.

• Add / rename / delete pages, and drag the grip handle to reorder them.
• Per‑page hero — every page has its own headline/slider.
• URL menu links — add external links (label + URL) that appear in the menu and open in a new tab, e.g. a link back to your website or docs.

Theme & dark mode

• Colour templates — 10 ready‑made palettes; or set your own primary and accent colours.
• Font pairing — several heading/body combinations.
• Light / Dark — toggle from the Theme panel, or with the moon/sun icon in the header. A viewer’s own choice is remembered on their device.

Global design panel

The Design button gives you site‑wide controls that apply across both light and dark themes:

Corners: sharp → round Density: compact → roomy Content width: narrow → full Shadows: flat / soft / bold Text size: small / normal / large

Saving & publishing

Click Save & Publish to write your design into the ANUPRESS_Config table in your document (a single row of settings). Anyone who opens the document then sees your published dashboard instead of the demo. Done leaves edit mode. Delete the ANUPRESS_Config table and the widget simply falls back to the demo.

FAQ & troubleshooting

Request a feature or send feedback

Found a bug, or want a new chart type or option? Tell us — this widget grows from real requests.

Advanced Charts is free and open source. If it saves you time and you’d like to help cover the running costs.

About ANUPRESS

ANUPRESS builds practical, no‑nonsense tools and honest reviews for people who run their own sites and data. If you found this useful, you might like our other hands‑on guides: