Images in Deneb not loading

Deneb Showcase
1

Hello, I would like to add images into my visuals.
In the documentation I found a simple chart:
image

It replaced one of the images with a random URL image I found on google which worked in the vega lite online editor https://vega.github.io/editor/#/examples/vega-lite/scatter_image.
My problem is when copy/pasting the code into the PowerBI deneb visual the images are not displayed.
Do you know what is happening?
image

Thanks

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "data": {
    "values": [
      {"x": 0.5, "y": 0.5, "img": "https://banner2.cleanpng.com/20180610/uls/kisspng-logo-online-and-offline-e-online-5b1d866f3dcc07.0769849515286616152531.jpg"},
      {"x": 1.5, "y": 1.5, "img": "data/gimp.png"},
      {"x": 2.5, "y": 2.5, "img": "data/7zip.png"}
    ]
  },
  "mark": {"type": "image", "width": 50, "height": 50},
  "encoding": {
    "x": {"field": "x", "type": "quantitative"},
    "y": {"field": "y", "type": "quantitative"},
    "url": {"field": "img", "type": "nominal"}
  }
}
2

Might want to review Kerry K’s post (https://kerrykolosko.com/images-and-custom-shapes-in-deneb/) on images - she has some excellent guidance there and also references another post by Chris Webb.

1 Like
3

Hi @Reporting … I’ve not tried the “image” mark before, and a few minutes of quick experimentation didn’t provide an answer, although I’m sure it has to do with how the “img” field is either (or both) specified or used. So simply a matter of finding the correct format, I’d guess. I’ll post if I find anything.
Greg

1 Like
4

Hello @Reporting, it’s been a while since we got a response from you.

Just following up if you still need help with your inquiry?

In case there won’t be any activity on it in the next few days, we’ll be tagging this post as Solved.

5

Hi @Greg,
Thank you very much for checking! Is the standard code working in your PBI environment?
Maybe it is something about my settings but I cannot find what to change :frowning:

6

@paidcritic Thank you. I was trying to rebuild Kerry’s visuals but I cannot continue with the image not loading.

@dm-p Hi Daniel, would you be so kind to check what I might be doing wrong?

7

Hi there,

If you’re using the AppSource version, you cannot load images from a remote URL. This is not permitted by Microsoft for certified visuals. You can load images by using a base64 URL (like in Kerry’s post), which ensures they are not loaded over HTTP.

You can use the standalone version for image URLs but this needs to be manually downloaded and installed in your report. Note that the standalone version is not certified.

More info here: https://deneb-viz.github.io/getting-started#standalone-version

Regards,

Daniel

5 Likes