topic Re: SVG Images are not shown correctly in DAX Commands and Tips

SVG Images are not shown correctly

Jens1983 — Thu, 26 Sep 2024 11:40:50 GMT

Hi everybody,

i am trying to implement svg graphics into my table. I followed different tutorials on youtube and i experience always the same problem. The SVG Image is shown incorrectly, it looks like that it is cut off, even if i labeled the meassure as image and played around with the imag size, which doesnt have any effect.

For example I tried to implement a star, using this code:

Stars = "data&colon;image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 100 100'>

</svg>"

and the outcome looks like this:

Re: SVG Images are not shown correctly

Greg_Deckler — Thu, 26 Sep 2024 12:53:32 GMT

Jens1983 I'm not super familiar with the path function. This works though:

Stars = "data&colon;image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'> <polygon points=""10,0 12,9 20,8 13,13 16,20 10,15 4,20 7,13 0,9 8,9"" style=""fill:red;stroke:red;stroke-width:0;fill-rule:evenodd;"" /> </svg>"

Comes from here: SVG Color Star Rating - Microsoft Fabric Community

Re: SVG Images are not shown correctly

Jens1983 — Thu, 26 Sep 2024 13:07:55 GMT

Hi Greg, thanks for the solution but when I use your code, it only shows an image symbol, even when i classify it as an image-url 😞

Re: SVG Images are not shown correctly

Anonymous — Mon, 30 Sep 2024 01:45:02 GMT

Hi Jens1983 ,

I suggest you to try this code.

Result is as below.

Best Regards,
Rico Zhou

If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.

Re: SVG Images are not shown correctly

Jens1983 — Fri, 27 Sep 2024 09:38:26 GMT

Still doesnt work, it shows only an image symbol, even if i label it as an image-url 😞

Re: SVG Images are not shown correctly

Greg_Deckler — Fri, 27 Sep 2024 13:53:01 GMT

Jens1983 What do you mean by "image symbol"? Can you share a screen shot? Remember, you need to replace the &colon; with an actual colon ( : ) for the SVG to work. It gets HTML encoded for whatever reason when pasting on this forum.

It should be classified as an image URL. What visual are you using it in? Below is with a standard Table visual. I am not aware of any Preview feature or anything else that should impact the display of SVG measures but will double check.

Re: SVG Images are not shown correctly

Anonymous — Mon, 30 Sep 2024 01:46:49 GMT

Hi Jens1983 ,

I think there may be something wrong when we copy the code and paste it in website.

I update the my reply with screenshot, it should be date:image... instead of data&colon... .

Please download my sample file and have a test.

Best Regards,
Rico Zhou

If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.

Re: SVG Images are not shown correctly

Jens1983 — Mon, 30 Sep 2024 06:37:30 GMT

This works, thanks for your help 🙂

Re: SVG Images are not shown correctly

Jens1983 — Mon, 30 Sep 2024 07:03:07 GMT

Thank you for your help, your solution also works fine for me 🙂