Filters and chart clicks

A filter bar lets a reader narrow the whole page in one go: pick "This month" and the numbers, the charts and the lists all show this month; pick a region and they all show that region. A click on a chart's bar does the same with that bar's value.

Add a filter bar

1. In the editor, choose Add element and Filter. The bar goes at the top of the page, already filled in: the date of the table most elements read, opening on This month, and the field the page's chart is drawn by.
2. On its Data tab, under Filters, each filter is one row with its name and what it opens on. Drag rows to reorder them; × removes one; a tap opens its settings.
3. Choose Add a filter to add another. The list has two groups:
   • Lists: a table the page's tables link to, such as Customers. Picking a customer narrows every element whose table links to Customers.
   • Fields: a field of one of the page's tables. It narrows the elements that read that table.

What each filter becomes

Photos, files, fields holding several values, calculations and lookups cannot be filters.

A filter takes one value or All. A reader cannot pick two regions at once.

A filter's settings

• Opens on: where the page starts, such as This month. It is not a limit: a reader can widen it to Any time.
• Shows only, for a list: which of its records a reader can pick from. A reader never picks outside it, and never sees the condition.
• Narrows, for a list: which of the page's tables it narrows, each through its own link. A table with no link to the list is shown greyed, with the reason.

Me is whoever opened the page. A filter that opens on Me needs a page published to workspace members, who sign in.

Which elements follow it

Every Number, Chart and List has a section On the page on its Data tab. Follows the page’s filters is on by default and names the filters it follows. Untick it to keep an element fixed, such as a company-wide total beside a filtered list. An element on another table follows a list through its link; when it has more than one link to that list's table, pick the one it follows under "…, through".

What readers see

The bar is one button per filter, named by it: "Placed: This month", "Region: All". A button that reads differently from how the page opened shows ×, and Reset appears to go back to the start. When a pick leaves a chart empty, the chart says so and offers Reset.

A reader's picks are kept in the page's address, so Back, a refresh or a forwarded link opens the page narrowed the same way.

On a page with tabs, the bar sits above the tabs and keeps its picks when the reader switches tab. A filter that narrows nothing on the open tab is drawn quiet, and the bar says which tab it narrows.

Clicking a chart

On a bar or pie chart, the On the page section has Tap a bar (or Tap a slice) with three choices:

• Narrows the page, the default: like picking that value in the page's filters. Every element that follows the filters narrows to it. Clicking the same bar again clears it.
• Opens its rows: the records behind that bar, in a side sheet, shown as the first List on the page that reads the same table shows them. It needs such a List on the page.
• Nothing.

On a computer, hovering a bar says what a click will do. On a phone, the first tap on a bar shows its value and the second acts.

The worked example in How to build a dashboard on your database narrows a sales page by region with a click on a bar.