Problem with My Custom Visual in Power BI

luanlopes — Mon, 07 Apr 2025 13:03:03 GMT

I've developed a DatePicker visual for Power BI, but I'm facing an annoying issue that affects user experience. When users interact with the report, my visual keeps flickering between showing the selected date and showing "Select period" (the no-filter state).
This rapid alternation between states happens most noticeably when users select a date or click the "Clear filters" button in Power BI. The root cause seems to be that my visual receives multiple contradictory updates from Power BI in quick succession. One update tells the visual that filters are applied, then immediately another update says no filters exist, then back again to filters being applied. This creates the flickering effect as my visual tries to respond to each update. I'd like to know if this behavior is normal in Power BI or if there's a recommended way to handle these contradictory updates. Is there a technique to make my visual display a consistent state? Also, is there a reliable way to detect when a user has clicked the "Clear filters" button?
Any help or suggestions from those who have encountered similar issues would be greatly appreciated.

Re: Problem with My Custom Visual in Power BI

johnbasha33 — Fri, 18 Apr 2025 14:00:51 GMT

Hi @luanlopes

How to Fix or Smooth it:

✅ 1. Debounce or Throttle update()

Implement a small delay (e.g., 50–200 milliseconds) inside your visual's update method.
Only re-render after things have "settled."

Example:

private updateTimer: any = null;

public update(options: VisualUpdateOptions) {
if (this.updateTimer) {
clearTimeout(this.updateTimer);
}

this.updateTimer = setTimeout(() => {
this.render(options);
}, 100); // adjust delay as needed
}

private render(options: VisualUpdateOptions) {
// Your regular drawing logic here
}

Compare the Old and New Data View

Before re-rendering, check if the "real" state actually changed.
Example idea:

if (JSON.stringify(newDataView) !== JSON.stringify(this.previousDataView)) {
this.previousDataView = newDataView;
this.render();
}

3. Detect "Clear Filter" actions smarter You can't directly detect "Clear filters" clicked.
BUT you can infer it because:
- If filters suddenly disappear (categorical.values or categorical.categories.values becomes empty or null),
- and the old state had selections,
- it probably means Clear Filters was clicked.
Sample pseudo-check:

const filtersCleared = previousStateHadFilters && currentStateHasNoFilters;
if (filtersCleared) {
// Handle it differently if needed
}

Did I answer your question? Mark my post as a solution! Appreciate your Kudos !!

topic Re: Problem with My Custom Visual in Power BI in Custom Visuals Development Discussion

Problem with My Custom Visual in Power BI

Re: Problem with My Custom Visual in Power BI

How to Fix or Smooth it: