Solvedsuperset Filters as a native dashboard (v2) construct

Making a list of ideas around how dashboard filters should work in dashboard v2.

Scope awareness. The filter affect only the charts and elements in its scope. Existing scopes should include:

• global (above tab-line)
• tab
• section
• more granular?

Maybe hovering the filter highlights the charts affected by the filter.

Per-filter configuration:

• type: select - radio - ? (radio probably not critical / MVP)
• multiple or single select
• sort order (based on metric / reverse / alphabetical)
• limit?
• show background bar (histogram)
• cascading-options (wether higher level filter should affect the values in the dropdown), maybe a whitelist blacklist approach?

Making it clear on charts that are filtered, maybe a filter icon that highlight which control are affecting the chart when hovered?

More input is welcomed.

Due to our changing priorities, we have been unable to complete the dashboard level filters feature. You can find our in progress work on my feature branch (https://github.com/jaylindquist/incubator-superset/tree/feature/native-filter) and I can create a PR if you are interested in keeping what we've been able to start.

Completed tasks:

• Add a drag-and-drop filters container at the top of dashboards
• Add filters to the filter container (filters are added, but configuration is hard coded)
• Remove filters from container
• Remove filters container from dashboard
• Update Dashboard short links to create preselect_filters parameter without chart IDs. URL short links are now generated as { "column1": ["val1"], "column2": ["val2", "val3"] }
• Update preselect_filters parameter to support filters without chart IDs while being backwards compatible. preselect_filters now supports the above format as well as the existing format { "chartId1": { "column1": ["val1"]}, "chartId2": { "column2": ["val2", "val3"]}}

The following shows adding filters to an existing dashboard:

There is still work to be done:

• Creating a modal to add new filters
• Manage date filters for each datasource
• Global filter configuration (for example, instant filtering)
• Saving selected filter options when the dashboard is saved

If you would like me to create a PR for this work, let me know. I apologize for not being able to complete the feature, but other tasks took priority for us.

@mistercrunch

We would like to add a proposal for the native dashboard filter as outlined in the first post. We are looking for feedback and approval before implementing.

Dashboard changes

• Global filters will be the focus of the MVP
  • Tab and section filters would work similarly but will not be included in the initial implementation. The initial focus will be to replace the existing Filter Box chart with a native, global dashboard filter
• The filter component is drag & drop from the insert panel, similar to tabs
  • Global filters go above dashboard-level tabs and below the dashboard title (see images below for an example)
  • Tab filters go below tabs
  • Section filters go at the top of the section
• New filters can be added when the dashboard is in "Edit Mode" via a button that appears after the list of filters
  • Individual filters are added based on datasource / column name
  • Clicking the New Filter button will open a modal with "Data Source" and "Column" options to select the filter column
  • If the column selected is a time column, the 'Since' / 'Until' filters will be added
• Filter controls for the dashboard are initially collapsed and can be expanded / collapsed as needed (see images below for an example)
• Additional options such as timegrain and instant filtering are added via the configuration cog

Chart changes

• Filter box will be removed as a chart type
• Filter boxes that are currently included in dashboards will need to be removed from the dashboard and options will be added as global filter options
• All existing filter box charts are deleted (not sure what else can be done with them since they can't be added to dashboards anymore)

URL changes

• The preselect_filters query parameter can still be used to fill in filters via a link. It is currently a map which includes the Filter Box ID. The format will need to change into a map of column name to arrays instead
  • Old format

  {
      "414": {
          "column1": [
              "value1",
              "value2"
          ]
      },
      "12": {
          "column2": [
              "value3"
          ]
      }
  }

  • New format

  {
    "column1": [
        "value1",
         "value2"
    ],
    "column2": [
        "value3"
    ]
  }

  • This change can be made backwards compatible by collecting the filters in the old format, ignoring the ID, and applying the filter values based on the column name

Dashboard mockups

Collapsed filters

Opened filters

New filter dialog

On-the-fly grouping. I often find that my filters affect how I want to group my charts. If, for instance I filter by region I might want to se a chart grouped by product, but if I then change my filter to product, I want to see that same chart grouped by region. Etc. So having a groupby element which can be made to affect specific charts would be very valuable.

I collected following feature requests from open source community, and from Airbnb usage:

• Filter component or filter_box from explore view? Given @mistercrunch comments above, I assume existed filter_box viz type will keep working as it, and will introduce new filter component lived inside dashboard. So there will be two types of filters working together.

• Scoped filter

  • Filter should be visible (scroll up/down is ok, but not extra tab switch) when it is applicable to any charts.
  • Top level filters:
    Filter is placed in dashboard without tab, or at top section of dashboard with row-level tabs. So that filters are always visible in the dashboard.
    Top level filters will apply to all charts in the dashboard.
  • Tab level filters:
    Tab level filters are placed inside a Tab component. As long as the tab component is visible, filters will apply to all charts in the same tab.

• Easy UI for user to see which charts are affected by which filter, and easy add immune from the filter.

• Easy UI to group multiple filters, and allow user define cascade filters.
  Current filters are filter_box that generated from explore view, so each of filter_box (can have multiple dropdowns) contains one slice of constraint, whereas dashboard may have multiple filter_boxes to add many constrains. If this is the case, i see our users always update one filter_box in dashboard, apply it, wait all charts in dashboard finished loading, then update another filter_box, wait another round of loading...It is very frustrating in daily use.
  
  So I am thinking dashboard should allow user group a few filter_boxes(and native filter components) together, in which user can update each filter but don't trigger dashboard level loading events. In the group user can also make cascade filters (where one filter react on other filters's selected values). And in the end user can apply all selected values altogether in 1 dashboard level load. This will greatly improve the dashboard filters usability.

• After user update filter and trigger the dashboard level refresh, can we have UI indicator showing filter is applying or done? Some of our dashboard is crazy big so it's hard to scroll back and forward to check if every chart is ready 😓

• Keep filters state in URL parameter [#5374]
  If user applied filter in dashboard, can we update dashboard's url parameter (or anywhere as a state of history), like url for explore view? So that when user refresh dashboard, the previously applied filters are still be memorized.
  Dashboard should not automatically save filter parameter unless user saved them as default_filter metadata.

• Coordinate Visual Correlation feature. Discussed in another thread, @JamshedRahman want to introduce a new feature that allow one chart to publish events to dashboard level, and all other charts in the dashboard that are listening to the events can change/react accordingly. These 2 features will implemented independently, but i just feel there might be some common logic to share.

These are all proposals. I would like to leave @xtinec who implements this feature to decide final list. Thank you!!