Power BI Embedded Tracking visual filters (slicers)

[guibovo]

Hello, I would like to know if there is a way to track visual filters (slicers) that are being applied in my embedded reports.

If there is, could some one tell me if there is a documentation about that? 

Or if there is no documentantion about that, please, how could I do this?

Thank you.

[dgpshiva]

The "visual.getSlicerState()" throws "Visual container config is not initialized" error.
Which seems to be a known issue:

https://community.powerbi.com/t5/Issues/setSlicerState-javascript-method-does-not-work/idi-p/517624 
https://github.com/jongio/PowerBI-visuals-radioSlicer/issues/2 

Is there a workaround for this?

[Jayendran]

Hi @guibovo ,

I don't think there is such a capability to track the slicers which applied on the runtime.

You can post that in the Idea Forum https://ideas.powerbi.com/forums/265200-power-bi-ideas

[guibovo · Accepted solution]

I have found a way to do that, not as beatiful as I want, but still a nice solution.

To those who are interested in this same case scenario, I have used PowerBI Javascript API, and with this API  to get all pages (report.getPages()) and run it to find the active page (page.isActive), then I get all visuals (page.getVisuals()) and filter it by slicers (visual.type === 'slicer'), by there I get a list of all slicers in my page, to get values of filtered slicers I simply check if the slicer has filters (it is an array), and if it do, I add to an array to save it later.

Long story short :

User PowerBI Javascript API -> get all pages of report -> get active page -> get all visuals in page -> filter by slicer -> get all slicers that have been filtered -> get slicer state to know what have been done to this filter -> do whatever you need with it.

const isSlicer = visual => visual.type === 'slicer';

const isPageActive = page => page.isActive;

...
  let embeddedReport = powerbi.embed(dashboardContainer, config);
  embeddedReport.on('rendered', function (event) {
    embeddedReport.getPages().then(pages => {
      activePage = pages.filter(isPageActive)[0];
      activePage.getVisuals().then(visuals => {
        slicers = visuals.filter(isSlicer);
        filteredSlicers = [];
        slicers.forEach(async slicer => {
          slicer.getSlicerState().then(slicerState => {
            if(slicerState.filters.length > 0) filteredSlicers.push(slicerState)
          })
        })
      });
    });
....

[andyparkerson]

You can go one further and look at the table in the filters in the slicer states. I do this and grab all of the ones whose tables are 'DimDate'. Those are the date slicers.

Then I can set the value to any desired date via slicer.setSlicerState().

This enables me to use a bootstrap javascript date picker instead of the radio button slicer.