Add image in Deneb

[Anonymous]

Hello everyone,

I discoverd a beautiful 3D chart in Deneb, made by Davide Bacci. I've made adjustments so that it's tailored to my data. 

I have an Icon column, which shows each specie in an image (for simplicity, I only added for each specie the same data). I tried many things, but I am not able to get the image visualized in the Deneb chart. I should be like the image I added below. I hope someone can help me with this. 

The file can be found using this link:

https://drive.google.com/file/d/1K3w0I8agKphRg8Rx__beyFeRhC0KgLn-/view?usp=sharing

[Anonymous]

Hi @Anonymous ,

First, verify that the URL in the "Icon" column is publicly accessible.

If the URL is restricted or broken, the image will not appear in the chart.

Second, in the Deneb visualization, make sure you use the "Icon" column correctly in the visualization properties.

The column should be referenced in such a way that Deneb recognizes it as the source of the image URL.

Please try：

"mark": {"type": "image"},
   "encoding": {
     "x": {"field": "x", "type": "quantitative"},
     "y": {"field": "y", "type": "quantitative"},
     "url": {"field": "Icon", "type": "nominal"}
   }

For more information on working with images in Vega-Lite, please see:

Image | Vega-Lite

This post may be helpful to you:

Solved: Deneb visual - Microsoft Fabric Community

If you have any further questions please feel free to contact me.

Best Regards,
Yang
Community Support Team

If there is any post helps, then please consider Accept it as the solution  to help the other members find it more quickly.
If I misunderstand your needs or you still have problems on it, please feel free to let us know. Thanks a lot!

[Anonymous]

Hi @Anonymous ,

Thanks for your fast and comprehensive reply :). 

The URL should be fine, since I can visualize it when I drop the column in a table. And you're correctly stating that the column Icon should be used in the right way for the visual properties. I have tried many different things, and I already looked at the site of Vega-Lite about images and the post about that Deneb visual as well (in fact, I posted that myself ;)). 

I adjusted a part of my code as follows: 
"mark": {"type": "image"},
"name": "Icon",
"from": {"data": "dataset"},
"encode": {
"update": {
"url": {"field": "Icon",
"type": "nominal"},
"y": {"signal": "scale('y', datum.Species)+bandwidth('y')/2"},
"baseline": {"value": "middle"},
"align": {"value": "center"},
"x": {"signal": "group1Width/2"}

Am I overlooking something? I hope you can help me further with this.