powerbi-embedded

Avoid PBI loading screen after applying filters with PBI Embedded JS


I set Basic filters using

await report.setFilters(pbiFilters)

Then, I render my reports using this function

await report.render()

which results in this loading screen

Power Bi Embedded Loading screen

But let's say I want to add new filters to the already rendered page? In my experience, this causes the loading screen above to trigger again (because I have to rerender the report when new filters are applied).

If I use a slicer within the Iframe and choose a filter from there, the loading screen is not triggered.

How can i set filters, using powerbi-embedded and PowerBI-javascript, while not causing the iframe to trigger the loading screen?

I have tried filtering on visuals, pages and reports. I have also tried the updateFilters function for each. However, the outcome is the same. I have not tried to filter the slicers in the embedded report directly. But this is not something I want to do, as there may be many different slicers that may change, which makes it difficult to maintain.


Solution

  • A useEffect caused the embedconfig to reset the entire embedding - causing the loading screen to appear.

    Key takeaway: setFilters or updateFilters do not cause the loading screen to appear. If the loading screen appears, you have done it wrong.