Deneb - Declarative visualization in Power BI, using the Vega language

Interactivity Features - Tooltips

Interactivity Features - Tooltips

Deneb is currently in public preview and lots of things are still being actively developed. This site is under construction and the information in this page may be subject to frequent change, so please check often to ensure that you're up-to-date.

We saw in the worked example, that it's fairly straightforward to add tooltips to a specification, but we'll unpack on this page in a bit more detail.

If you haven't read it already, it's worth reviewing the preceding page to understand some of the considerations that need to be made with integrating back to Power BI. It will certainly help with understanding the logistics around report page tooltips in particular.

Tooltip Strategy

Both Vega and Vega-Lite both provide the ability to customize how their tooltip events can be interpreted. Deneb contains a tooltip handler writen specifically for Power BI, which will display under the following conditions:

  1. Tooltip Handler is enabled in the Vega > Power BI Interactivity section of the Settings pane in the Visual editor. This is currently enabled by default.

  2. An appropriate tooltip property is assigned to a mark. Refer below for the recommended syntax for each provider.

  3. A tooltip-enabled mark is hovered over.

Data Point Resolution

Provided that your mark's datum is not transformed or mutated away from the "dataset" and represents the "pure" row context passed-in, Deneb can resolve this back to Power BI for delegation.

If a report page exists with at least one of the columns in the current datum, then Power BI will display it for the current row context, e.g.:

tooltip-report-page-example.png

If there is no suitable report page for the current datum or you have specified a default tooltip in the Tooltip menu in Power BI's Properties pane, then a default tooltip will be displayed, e.g.:

tooltip-default-example.png

A default tooltip will display all values for the current mark's datum, including any other columns or measures bound to its particular row context.

Default Tooltip Styling

This is done in the usual way, i.e. in the Tooltip menu in Power BI's properties pane.

Vega-Lite Syntax

The simplest approach for this is recommended, e.g.:

{
...
"mark": {
...
"tooltip": true,
...
},
...
}

Vega Syntax

With Vega, you need to specify the tooltip signal in your mark's encode property, e.g.:

{
...
"encode": {
"enter": {
...
"tooltip": {
"signal": "datum"
},
...
}
},
...
}

Limitations and Considerations

  • It's been mentioned countless times already, but tooltip integration with Power BI is wholly dependent on the correct row context. Refer above, or to the Overview page for more information about ensuring this is preserved.

  • Adding a tooltip does not automatically add visual feedback or effects. If you want to track the position of the resolved data point more visually (e.g. like for a line chart), you will need to add a suitable set of marks to do this. Both Vega and Vega-Lite have examples you can refer to.

  • Development so far has been focused on Power BI integration. It's possible that if you deviate from the above patterns, then tooltips may not display correctly. If you find any such use cases, please create an issue with the appropriate reproduction steps (e.g. example specification and/or data) and we'll see what we can do about it.

Edit this page on GitHub