Saving map to html creates a blank webpage

[giswqs]

Saving the map to html runs without any issue. However, when opening the HTML, the page is blank (see this link). You can view the page source to see its content. Related issue https://github.com/giswqs/leafmap/discussions/23

import ipyleaflet  #v0.13.6
m = ipyleaflet.Map()
m.save("mymap.html")

[helincao]

Just to add, here is the error msg from my Chrome console when a page shows blank result.

[martinRenou]

Thanks for sharing the console! Indeed, this Script error for "map-widget-for-jupyter" happens in your example as well @giswqs. This error is very likely due to here-map-widget-for-jupyter, I suspect they didn't upload their package on npmjs, which prevents the HTML widget manager to download their package to render the map.

I would suggest opening an issue there, asking for publishing on npmjs.

[sackh]

map-widget-for-jupyter already is published on npmjs. - https://www.npmjs.com/package/@here/map-widget-for-jupyter I think the main problem is that somehow ipywidgets is not able to identify npm packages with scopes. as the package is under @here scope hence it is not able to find it. I have raised this issue for documentation also on jupyter sphinx - https://github.com/jupyter/jupyter-sphinx/issues/174. I think I have the path correctly defined in webpack.config.js - https://github.com/heremaps/here-map-widget-for-jupyter/blob/5a6cdcbe8bdbd4cd7b86fd666f3c62cc0f43cff5/js/webpack.config.js#L110

[martinRenou]

ipywidgets should handle scopes properly, it uses a specific scope itself.

So maybe the issue comes from the missing scope here? https://github.com/heremaps/here-map-widget-for-jupyter/blob/master/here_map_widget/map.py#L69

[sackh]

Thank you @martinRenou. I will change it to @here/map-widget-for-jupyter. and I will update here if this works.

[sackh]

@martinRenou Thanks, the fix you suggested works and I have released a new version of here-map-widget-for-jupyter with this fix. Now widget bundle not found issue on unpkg.com is resolved in the new release.

[giswqs]

The latest version of HERE map widget has fixed this issue. The exported map can now render correctly. Thanks @sackh

[sromano]

The error seems to be back in 0.17.2

In Colab I simply run:

!pip install -U ipyleaflet
import ipyleaflet
m = ipyleaflet.Map()
m.save('mymap.html')

and the resulting mymap file does not work in Chrome due to NaN in tile resources https://tile.openstreetmap.org/NaN/2047/2047.png

Same happens with the basic example:

from ipyleaflet import Map, basemaps, basemap_to_tiles

m = Map(
    basemap=basemap_to_tiles(basemaps.NASAGIBS.ModisTerraTrueColorCR, "2017-04-08"),
    center=(52.204793, 360.121558),
    zoom=4
)

Console shows 404 of different resources due to "NaN" in the TILEMATRIX https://map1.vis.earthdata.nasa.gov/wmts-webmerc/MODIS_Terra_CorrectedReflectance_TrueColor/default/2017-04-08/GoogleMapsCompatible_Level9/NaN/5/7.jpg

html.zip