Forum Discussion

tarockx's avatar
tarockx
Frequent Visitor
2 years ago

Custom Visuals become blurry when zooming the canvas

Hello everyone

 

I am experiencing a weird problem with all my power bi custom visuals that I am pretty sure only appeared recently.

Basically, whenever I set the report canvas to a zoom level other than 100%, my custom visuals (especially the fonts) become all blurry.

Initially I thought this was normal and that the zoom performed some crappy non-vectorial zoom on the entire canvas, but after further testing I noticed that this is not the case: the Power Bi native visuals are always crisp and clear no matter the zoom level, so it must be some specific issue with custom visuals.

Here is a screenshot to showcase the issue (NOTE: the issue may be less noticeable if you view the image inline, if you download it and zoom in it will be more clear):

As you can see, at 100% zoom level both the native Table and my custom button are cripy and display well.

But at 90% zoom you can see that the native Table is still crispy, while the text inside my button is blurry and almost unreadable.

I already tried to play around with font sizes (using em/rem to make the font size proportional, etc.) but nothing changed.

 

Is anyone else experiencing this issue? Any way to avoid/fix it?

21 Replies

  • tarockx's avatar
    tarockx
    Frequent Visitor

    For the people that are experiencing this issue, an update: I've heard back from Microsoft support and they confirmed the issue is known and under investigation.

    • hb-webdev's avatar
      hb-webdev
      Advocate II

      Still under investigation, I presume? Very ugly...

       

      • dm-p's avatar
        dm-p
        Super User

        The issue has been pushed back from MS to the Chromium team, who are currently working on a fix for all Chromium-based browsers. There is still no ETA 😞

  • dm-p's avatar
    dm-p
    Super User

    Hi tarockx,

     

    Are you using Chrome? If so, this seems to be an issue with the latest version. I haven't observed in Edge yet (and Firefox looks OK to me), but I suspect that as Edge and Desktop are Chromium-based, they will eventually catch up.

     

    I raised this with MS a few weeks ago, and they said they're looking into it, but I recommend you also raise a support issue at [email protected] so they can be aware of the impact on users other than myself.

     

    Regards,

     

    Daniel

    • jaminica's avatar
      jaminica
      New Member

      Hi All, I am also experiencing this issue with blurry custom visuals for a few weeks now when you view the page at anything but 100% zoom.  I had raised this with one of the custom visual providers and they said that it was caused by an API update from Microsoft a few weeks ago.

       

      I hope this is going to be fixed quickly because it is affecting user experience.

  • Covid19's avatar
    Covid19
    Frequent Visitor

    When debugging in chrome, this problem was always there, no one cares about the developer's eyes.

    • dm-p's avatar
      dm-p
      Super User

      Not for meβ€”I can downgrade Chrome to a recent, but earlier version, and the visuals are clear. However, the blurriness is now happening in Edge for me since I upgraded to the latest version (127.0.2651.86), so this is going to affect more users as they start to update their browsers too 😞

      • Covid19's avatar
        Covid19
        Frequent Visitor

        In pbi desktop, imported .pbiviz, in my opinion, does not soap, I'm not sure), I only care during development-debugging), I don't use them.

    • Antonyr's avatar
      Antonyr
      New Member

      This issue seems to have re-appeared, is anyone else having the issue?

       

      I have a custom visual that looks blurry, unless I change the view to Actual Size, but then the visual doesn't re-size when I change my window size. 

      The issue only occurs in Chromium browsers, edge & Chrome. It works ok in Firefox

      • dm-p's avatar
        dm-p
        Super User

        Yes, it seemed to return partially about two months ago for visuals that caused the viewport to overflow (i.e., scrolling content). It's now completely back for all content, so it looks to have become increasingly broken over a couple of Chromium updates 😞

         

        I reported to the custom visuals team when things originally started to break but we haven't seen much progress yet. If you want to check on the status of this, you'd be best emailing [email protected] to contact the team directly.

  • FYI, I had this same issue and tried all the same troubleshoots I saw in this forum & others. What worked for me was removing the rounded corners from the Gantt visual πŸ˜‘ that's all it was. I spent hours publishing & republishing the same visual to isolate the issue, and for me, it came to using rounded corners in the visual border.

     

    Maybe this exact fix will work for you, but if not, I highly recommend playing around with the styling/effects you've applied to your visual and maybe toggling some of those off will fix the blurriness.

  • Hi all,

    For anyone dealing with it right now, a couple of temporary workarounds worth trying:

    • Viewing the report at Actual Size (100%) eliminates the blurriness entirely
    • Firefox does not appear affected, so it can serve as a stopgap for affected users
    • Toggling off certain visual formatting options like rounded corners on the visual border has helped some users, so it is worth experimenting with applied effects.

      Hope this is helpful,
      Anna
  • It sounds like a rendering issue with custom visual rather than yyour code. If native visuals remain sharp at different zoom levels, this could be a recent Power BI rendering regression. I'd test in the latest Desktop version and different browsers, and if it persists, report it as a bug to Microsoft.