BLOGS BY TOPIC
BLOGS BY AUTHOR
BLOGS BY YEAR
This month's update allows users to add customisable buttons to a report, incorporates a numeric slicer and includes a few other smaller changes.
- New features in the April 2018 update of Power BI Desktop
- Action buttons (this blog)
- Numeric slicers
- Changing the line and marker style for combination charts
- Choose your organisational custom visuals
- Features still in preview as of April 2018
Posted by Andy Brown on 07 April 2018
You need a minimum screen resolution of about 700 pixels width to see our blogs. This is because they contain diagrams and tables which would not be viewable easily on a mobile phone or small laptop. Please use a larger tablet, notebook or desktop computer, or change your screen resolution settings.
Until now in Power BI Desktop you've had to mimic clickable buttons:
Until this release of Power BI Desktop, actions could only be assigned to images or shapes (however much you disguised them to look like buttons).
Now, however, Power BI Desktop has a dedicated button!
You can insert a button, and configure it to display additional text and to behave differently when a user hovers over it.
Here's an example of a configured button:
|The button as it looks normally||The button when you hover over it|
As this shows (and the rest of this blog will demonstrate), you can configure both the icon for a button and its accompanying text.
The rest of this blog shows how you can use a button to return to the previous page of a report, having clicked on an image to invoke a bookmark.
The example for this blog
Suppose that on one page of a report you've added 3 images:
The idea is that you can click on a picture to see the appropriate animal's data.
On another page you've added a matrix or other visual:
We'll use bookmarks to filter this to show only data for a particular family of animals.
You've also created 3 bookmarks to filter the matrix by each of 3 types of animal:
Suggested names for your 3 bookmarks. The Amphibian bookmark, for example, should filter the matrix to show only Amphibian data.
Having assigned the bookmarks to the respective images, you are now able to click on a picture to see that animal's data!
If you don't know how to create bookmarks, see our previous blog showing how to create and use bookmarks.
Creating the BACK button
The problem is now that you have no way to return to the images page. To solve this, add a button:
You can add a range of buttons, but it seems to make most sense to add a Back one. If you're wondering what Q&A is, this refers to a feature which is still in preview mode, whereby you can ask questions of a visual's data.
We now need to format the button so that it looks better:
|The original button||The final button|
To do this, select the button and go to its format properties:
The settings for our final button. The button displays text and an icon, has an outline border and a background fill colour.
Note that the Title, Background and Border properties apply not to the button itself but to a title displaying above it (which we've chosen not to show).
Understanding Default, Hover and Select
On any web page, a button can be in one of these 3 states:
|State||What it means|
|Default||You haven't clicked on the button.|
|Hover||Your mouse is hovering over the button, but you haven't clicked on it.|
|Select||You've clicked on the button, and are holding your mouse down.|
For each aspect of the button's formatting, you can configure each of these states independently. For example, here's how to configure the Hover state for the icon:
When you choose Hover from the dropdown, any settings that you make will only show up when you hover over the button.
This makes life difficult! The only way to see the effect of what you're doing is to hover over the button. Here I've decided to show the button with a blue background when a user hovers over it:
It's only when I let my mouse linger over the button that I can see the blue fill colour I've chosen.
The only way to see exactly what your button will look like in the real world is to publish it to Power BI Server, and browse your report there. However, you can get a pretty good idea of how the button will look while still in Power BI Desktop.
The DEFAULT formatting for our button
To give an idea of what's possible, below are the settings I used to create my button (as it will look in its default, unselected state):
The default state for the button: the icon and text appear in a red font, on a yellow background, and with a black border.
The text on the button says Change animal in red:
The text has a large space round it (called padding), and has a red font.
The icon itself appears with some blank space around it, and has a red line colour:
The icon shows a back arrow in dark red, with a 3 point line thickness.
The border of the button shows in a dark colour:
The border has a 3 pixel width, and is dark grey.
The background colour of the button appears in yellow:
The fill colour for the button is yellow, with a semi-transparent effect.
With the roll-out of bookmarks last month and buttons this month, Power BI reports can suddenly be much more dynamic for a user. I look forward to seeing what Microsoft have in store for us all in future updates!