This post uses Power BI Buttons and Toggles, Chaging toggles to grouped images as a starting point
And we have 3 toggles moving to 3 hidden visuals, with pie as the starting point
And we have a grouping of Toggles on and Toggles off with toggles hidden based on what bookmark we are on
But say we wanted to add another panel on the page with three other visuals. First of all we need to update the page and our Bookmarks and selections
We need to make space for the 2nd panel. Move the grouped toggles, Text and make each visual smaller:
With Pie Bookmark selected, Move Toggle on group and Toggle Off group. Move the toggle text
You don’t need to update the bookmark because we haven’t yet amended anything in the selection
Click on Funnel . The toggles are already done so make the funnel visual smaller
Do the same with Map
Now we are ready to make some changes to the selections. Toggle On Rename to Panel 1 Toggles on. Toggle 2. Toggle off Rename to Panel 1 Toggles Off
Lets group the Visuals for Panel 1 also. With CTRL held down select the 3 visuals. Then right click on the pie chart and select group. Rename to panel 1 visuals
Open up this grouping and note that the correct visuals are still hidden when you select each bookmark
Finally lets rename the bookmarks we have to include Panel 1
We are now ready to implement panel 2
Ive added 3 new visuals. Line chart, Tree Map and a card. We will start with the line chart. Next Tree Map and Finally the Card
In Selection Order them and Renamed them Line Chart and Tree Map. Next put them on top of one another.
I have then selected all three by holding down the ctrl key. Clicked on the visual and chose Group, Ive renamed it Panel 2 visuals
Note if you move things in the selection pane with your groupings open, then seem to get added to the grouping above them. If you move objects, close the groupings first.
Next we want to add 3 more bookmarks. Call them Panel 2 Line Chart, Panel 2 Tree Map, Panel 2 Card
Within Bookmarks … Line Chart should have data ticked, the other 2 should have data unticked as per our previous bookmarks
Next we want the 6 toggles (3 On and 3 Off) Lets add the On ones first. The same images from part 1 of this post will be used
Call the 3 On buttons, Line On Img, Tree Map On Img, Card On Img
Again we can group then Panel 2 Toggles On
Next add the 3 Off buttons over the On buttons. At this point its really good to get the images in exactly the same place and size as the on buttons.
Call the 3 Off buttons, Line Off Img, Tree Map Off Img, Card Off Img
Select, Group and call them Panel 2 Toggles Off.
Finally add your panel 2 text box
You now have everything you need to get started to show and hide bookmarks.
However, you only want to show and hide visuals for panel against the panel 1 bookmarks. You don’t want any changes you make in panel 2 to affect panel 1.
We now need to change every single bookmark from All Visuals to Selected Visuals
Lets go through each bookmark and Ensure that the right information is set
Click on Panel 1 Pie bookmark. The only Selection groups that matter are Panel 1 Groupings. Close all the Panel 2 groupings in the selection pane
Note that all the right visuals are hidden because we have already sorted out this visual
Close all Panel 1 Groups
With CTRL held down select Panel 1 Groupings containing all the visuals. Then Select … against Panel 1 Pie Bookmark and Update Visuals. Because its now Against Selected Visuals only Panel 1 Groupings will be affected
Open up Panel 1 Panes and Move to Panel 1 Funnel
Note that you now have to recreate shown and hidden visuals for Funnel. Again with The Panel 1 groups selected Update the Bookmark (Selected Visuals Update)
Next Click on Panel 1 Map. Again, Note that you have to recreate all the selections
And again with Panel 1 Groupings selected Click on Save
You can now click on each bookmark and note that panel 1 changes. Panel 1 is working.
Time to move to Panel 2. Close all Panel 1 groupings under Selection and Open Panel 2
The First setting for the Line Chart. On Toggles hidden for Tree Map and Card. Off Toggle Hidden for Line Chart. Tree map and Card visuals hidden.
With Panel 2 groups selected. Update Panel 2 Line Chart Bookmark
Now Set up Panel 2 Tree Map Bookmark
And Finally Panel 2 Card Bookmark
Finally, We need to make sure that all our Buttons are active. This is relevant for everything in Toggles Off panel.
We know that all our Panel 1 off buttons go to the right place because we set this up in the last blog so lets do Panel 2 Toggles Off
We have the Line Chart Bookmark selected so for both Off None hidden visuals, set the action to the appropriate Bookmark.
We need to move to another bookmark to do line because its off. Move to Panel 2 Tree Map. From here, click on Line Chart Off Img and Set the Action in Format to Panel 2 Line Chart.
Note. If you forgot to save at any time. Simply, Highlight the panels. Ensure the correct images are shown and hidden and then update. Always update with the Correct Groups selected
Before Publishing, lets move to the bookmarks we want as our top bookmarks. Click on Panel 1 Pie Bookmark
Click on Panel 2 Line Chart
Go to Power BI Service and check that its all working
Great, we now have two toggle panels. Both Work.
Just remember, Add eveything into groups
Panel 1 Off Images
Panel 1 On Images
Panel 2 Off Images
Panel 2 On Images
Panel 1 Visuals
Panel 2 Visuals
Ensure Selected Visuals is selected in Each Bookmark.
Ensure Actions are set on the correct visuals to move to the selected Bookmark
When ever you update, ensure the groupings are Selected.
You are good to go