Click actions

Left-click actions (onClick)

Add onClick when a click should filter the dashboard, drill into a detail page, or open an overlay, and you want the hover affordance to tell readers a panel is clickable before they click it.

Revenue by region

Filter to EMEA

NAEMEAAPACLATAM

What you can do

An onClick action takes exactly one kind: filter, drill, or openOverlay. copy, export, and link are right-click only.
Every onClick action requires type and label; label is the hover affordance text shown before the click, with no opt-out.
filter and drill bind the clicked value with param + valueFrom + valueType, or with a bindings array of {param, valueFrom, valueType}. Use exactly one of the two.
valueFrom reads category, value, seriesName, or a field name; valueType is string, number, date, or boolean.
Labels can template {category}, {value}, {seriesName}, or a field name from the clicked datum.
On a table panel the click target is a cell but the bound datum is the whole row; each actionable row is one tab stop, and Enter or Space activates it.

Available on every chart:* panel type plus table, kpi, stat, and metric-strip; not allowed on filter, filter-bar, container, divider, section, text, html, hero, media, or agent panels, and inert on chart:line:racing.

Spec

View spec

{
  "id": "rev-by-region",
  "type": "chart:bar",
  "title": "Revenue by region",
  "data": {
    "query": "SELECT region, SUM(amount) AS revenue FROM orders GROUP BY 1"
  },
  "spec": {
    "categoryField": "region",
    "valueField": "revenue"
  },
  "onClick": {
    "type": "filter",
    "label": "Filter to {category}",
    "param": "region",
    "valueFrom": "category",
    "valueType": "string",
    "targets": "all"
  }
}

onClick.label templates {category} from the clicked bar, and param binds the resulting filter under the name region.

Try it live

Open the pipeline-control-room template in the Builder

Open the pipeline-control-room template and click a segment of cr-stage-mix to see the hover affordance and the resulting filter.

Build it in dvt

Every interaction on this site is a few lines of the same declarative JSON spec. Read the full spec format, or connect an AI agent to your warehouse and build one live in the quickstart.

Follow the build

dvt is in founding research. Leave your email and we'll reach out when there's something to see — no newsletters, no noise.