Building Interactive Tooltip Pages

Hello! Welcome back to our course on creating financial data visualizations.

In our last lesson, we took a significant step by learning DAX, Power BI's formula language. You created your first measures, including a powerful Year-over-Year growth calculation. This allows you to embed custom analytics directly into your reports.

Today, we're going to learn how to present that extra layer of analysis in a sleek and professional way. Our goal is to create custom tooltip pages to provide deeper contextual information on demand. Instead of the default tooltip that just lists values, you'll design a mini-report that appears when a user hovers over a data point, offering rich visuals and insights without cluttering your main dashboard. This is a key technique for creating the "nice," high-impact financial visualizations you're aiming for.

Let's imagine you have a chart of major market indices. When you hover over a specific index, wouldn't it be great to see a pop-up showing its sector breakdown and recent performance trend? That's exactly what a custom tooltip page allows you to do.

1. Default Tooltips vs. Custom Tooltip Pages

By default, when you hover over a data point in a Power BI visual, a small black box appears showing the values that make up that point. This is the default tooltip. You can add more data to it by dragging fields into the "Tooltips" well in the Visualizations pane, but you're limited to a simple list of values.

A custom tooltip page is different. It's a completely separate report page that you design specifically to act as a tooltip. This page can contain any combination of visuals: charts, KPIs, gauges, text, and even images. This unlocks a new level of interactivity and information density for your financial reports.

2. How to Create a Custom Tooltip Page

The process involves three main stages:

1. Create and configure a new report page to act as a tooltip.
2. Design and build the visuals you want to display inside the tooltip.
3. Connect the tooltip page to a visual on your main report.

Let's walk through this process with a detailed video guide.

3. A Financial Application: Stock Performance Tooltip

Let's apply this to a financial scenario. Imagine you have a line chart on your main report showing the closing price of a stock over time. You want the tooltip to provide deeper context for any given day.

Step 1: Create the Tooltip Page

• Add a new page and name it something descriptive, like TT_Stock_Detail.
• Go to Format your report page > Canvas settings.
• Change the Type from 16:9 to Tooltip. Power BI will automatically resize the canvas.

Step 2: Build Your Tooltip Visuals
Now you have a mini-canvas to work with. Let's add some insightful financial visuals:

• KPI Cards: Add two Card visuals.
  • One to show the Volume for that day.
  • Another to show the Year-over-Year Growth % for that day's price (using the DAX measure we discussed in the last lesson!).
• Gauge Visual: Add a Gauge visual.
  • Set the Value to the stock's closing price for that day.
  • Set the Minimum value to the 52-week low and the Maximum value to the 52-week high. This instantly shows where the current price stands in its yearly range.

Step 3: Link the Tooltip Page

• Go back to your main report page with the stock price line chart.
• Select the line chart visual.
• Go to the Format visual pane > General > Tooltips.
• Expand the options. Change the Type to Report page.
• In the Page dropdown, select your TT_Stock_Detail page.

Now, when you hover over any point on the line chart, your custom tooltip with the KPIs and gauge will appear, dynamically filtered to that specific day.

4. Advanced Design and Best Practices

To make your tooltips even more professional, there are a few extra tips you can use. The next video provides some great ideas for design and organization.

For a handy text-based guide that you can refer back to, the article "How to create interactive tooltips in Power BI" from Chandoo.org covers these same steps clearly.

Conclusion

You've just added a powerful and elegant feature to your Power BI toolkit. Custom tooltips allow you to add significant depth and context to your financial visualizations, telling a richer story without overwhelming your audience with information.

Key Takeaways:

• Custom tooltip pages replace the default list of values with a rich, mini-report that appears on hover.
• The process is straightforward: create a new page, set its Canvas settings type to Tooltip, add your desired visuals, and link it from the Format visual pane of your main chart.
• This is a perfect way to display the DAX measures (like YoY%) and other detailed analytics you've been building.
• For a clean user experience, always remember to right-click and hide your tooltip pages from the report view.

In our next lesson, we will begin Module 5 and start assembling all the pieces we've learned. You'll learn how to build a multi-page financial dashboard, bringing together different charts, slicers, DAX measures, and the custom tooltips you mastered today into a single, cohesive, and interactive report.