Icon(icon_url="local_file.png") not working

[pybokeh]

Hello, I am trying to use a custom image for a marker. The image file is located on my local machine, but I've tried a couple different ways to refer to or point to my local image file. I've tried:

icon_url="local_file.png" icon_url="file:///path/to/local_file.png"

This similar issue https://github.com/jupyter-widgets/ipyleaflet/issues/347 seems to indicate my first example should have worked, but it doesn't.

I was able to make it work by hosting that image on a localhost, simple HTTP server via python -m http.server, so this worked: Icon(icon_url="http://127.0.0.1:8000/custom_image.png")

I am using jupyter lab on Windows 10 machine with ipywidgets version 7.5.1

[sackh]

.png file needs to be present in any directory under the root directory from where you are launching jupyter lab . and for Jupyter lab right click on the image file and click on Copy Download Link and paste that URL as icon_url.

for Jupyter Notebook: icon_url='leaf-green.png' will work.

[pybokeh]

@sackh Thank you! That worked. I am so used to things where the path is relative to the opened notebook, not the juptyer server. I see that Copy Path does not work, just the Copy Download Link. I'll have to keep that in mind.

[martinRenou]

I am so used to things where the path is relative to the opened notebook

Yes, this is annoying. I wonder if we could do something smarter in ipyleaflet. Maybe reusing the ipywidgets.Image widget, which would load the Image in memory and send it to the front-end for the map to use it, instead of sending the url, this way the path would always be relative to the Notebook. We could also have a similar API like Icon.from_url, Icon.from_file, which will make it clear when it's an url to an online file and when it's a local file.

[deeplook]

The easiest thing is to document the current behaviour.

[martinRenou]

There is some documentation about this in there: https://ipyleaflet.readthedocs.io/en/latest/api_reference/local_tile_layer.html#example, I guess it's just a matter of copying this documentation to the Image page for now.

But what I am suggesting is to simplify this logic so that it's not surprising to users.

[abcdehc]

@martinRenou : this example seems lost? https://ipyleaflet.readthedocs.io/en/latest/api_reference/local_tile_layer.html#example

[martinRenou]

It's here now https://ipyleaflet.readthedocs.io/en/latest/layers/local_tile_layer.html