Skip to content

Drill-Down Example (Planned)

Coming Soon

Click interactions for drill-down dashboards are planned but not yet implemented. This page documents the planned syntax and behavior.

A board demonstrating click interactions and drill-down navigation.

Planned Behavior

The goal is to allow users to click on chart elements to filter detail views:

title: "Interactive Sales Board"

variables:
  selected_month:
    input: select
    default: ""

queries:
  monthly_sales:
    metrics: [total_revenue]
    dimensions: [month, region]

  monthly_detail:
    metrics: [total_revenue, order_count]
    dimensions: [day, product]
    filters:
      month: selected_month

rows:
  - title: "Monthly Overview"
    cols:
      - month_selector:
          title: "Click a Month to View Details"
          query: queries.monthly_sales
          type: bar
          x: month
          y: total_revenue
          color: region
          interactions:           # Not yet functional
            click:
              action: set_variable
              target: "selected_month"
              value_map:
                field: "month"
                format: "YYYY-MM"

      - month_detail:
          title: "Daily Sales for Selected Month"
          query: queries.monthly_detail
          type: line
          x: day
          y: total_revenue
          color: product

Planned Click Action Types

Set Variable

Update a variable from chart click:

interactions:
  click:
    action: set_variable
    target: "variable_name"
    value_map:
      field: "field_name"
      format: "YYYY-MM"  # Optional

Filter Other Charts

Filter other charts when clicking:

interactions:
  click:
    action: filter
    target: ["chart1", "chart2"]

Navigate to a URL:

interactions:
  click:
    action: link
    target: "https://example.com/detail"

Current Alternative: Use Dropdown Variables

Until click interactions are implemented, you can achieve similar filtering behavior using dropdown variables:

title: "Sales Board with Filters"

variables:
  selected_month:
    label: "Select Month"
    input: select
    options:
      static: ["2024-01", "2024-02", "2024-03", "2024-04"]

queries:
  monthly_detail:
    metrics: [total_revenue, order_count]
    dimensions: [day, product]
    filters:
      month: "{{ selected_month }}"

rows:
  - cols:
      - detail_chart:
          title: "Daily Sales for {{ selected_month }}"
          query: queries.monthly_detail
          type: line
          x: day
          y: total_revenue