write_html produces non-working embed if height is not explicitly specified

[gsanou]

Hello thank you for your work,

I want to signal a problem about the html generated with

Sigma.write_html(
    graph=g,
    path="../test2.html",
    node_size=g.degree,
    default_edge_type="curve",
    node_border_color_from="node",
    node_metrics=["louvain"],
    node_color="louvain",
    start_layout=5,
    edge_size=lambda u, v: g.degree(u) + g.degree(v),
    edge_size_range=(0.5, 5),
    label_font="cursive",
    node_label_size=g.degree,
    edge_label=edge_labels,
    edge_color_gradient=("yellow", "red"),
    clickable_edges=True,
    max_categorical_colors=30,
    # hide_info_panel=True,
    # label_density=3,
)

In fact when i try to open it in my navigator, nothing appears, blank page, i inspect with the navigation tools and i found that some js script cannot be found (404) below. Thank you for your support, Gaoussou

[Yomguithereal]

Hello @gsanou, can you tell me the version of jupyter (notebook or lab) and the python version you are using because I cannot reproduce your error. It might be that you need to serve the file for it to work as I don't remember if Jupyter knows how to build proper encapsulated html file openable as is (you can serv with python -m http.server for instance).

[gsanou]

Hello @Yomguithereal , I think it's not a service probleme, i inspect the html generated by ipysigment i found that the js scripts was https://cdn.jsdelivr.net/npm/@jupyter-widgets/html-manager@^1.0.1/dist/embed-amd.js which is different with the js script of the demo.html. Anyway this is my version of python : Python 3.10.6 and for jupyter-lab it is :3.6.3 Thank you for your support

[Yomguithereal]

I don't find a way to reproduce so I don't really know what to do. What is your version of ipywidgets or jupyterlab-widgets? What does jupyter labextension list gives you?

[gsanou]

These the version: jupyterlab-widgets==3.0.7 , ipywidgets==8.0.6

JupyterLab v3.6.3
/home/gaoussou/.local/share/jupyter/labextensions
        ipysigma v0.24.1 enabled OK (python, ipysigma)
        ipylab v0.7.1 enabled OK (python, ipylab)
        yfiles-jupyter-graphs v1.4.3 enabled OK (python, yfiles_jupyter_graphs)
        jupyter-cytoscape v1.3.3 enabled OK
        jupyterlab-nvdashboard v0.7.0 enabled OK (python, jupyterlab_nvdashboard)
        jupyterlab_pygments v0.2.2 enabled OK (python, jupyterlab_pygments)
        diginlineprofiler v0.1.2 enabled OK (python, diginlineprofiler)
        jupyterlab_tensorboard_pro v0.7.0 enabled OK (python, jupyterlab_tensorboard_pro)
        @jupyterlab/server-proxy v3.2.2 enabled OK
        @jupyrdf/jupyter-forcegraph v0.3.1 enabled OK
        @jupyter-widgets/jupyterlab-manager v5.0.7 enabled OK (python, jupyterlab_widgets)
        @jlab-enhanced/cell-toolbar v3.5.1 enabled OK (python, jlab-enhanced-cell-toolbar)
        @pyviz/jupyterlab_pyviz v2.2.1 enabled OK (python, pyviz_comms)

Other labextensions (built into JupyterLab)
   app dir: /home/gaoussou/.local/share/jupyter/lab
        @jupyterlab/apputils v3.6.3 enabled OK
        @jupyterlab/ui-profiler v0.1.8 enabled OK
        digautoprofiler v0.2.9 enabled OK
        ipytableview v0.1.4 enabled OK
        jupyter-matplotlib v0.11.3 enabled OK
        jupyterlab-drawio v0.9.0 enabled OK
        jupyterlab-pytutor v0.1.1 enabled OK

Sigma.write_html(
    graph=g,
    path="../test2.html",
    node_size=g.degree,
    default_edge_type="curve",
    node_border_color_from="node",
    node_metrics=["louvain"],
    node_color="louvain",
     start_layout=5,
     edge_size=lambda u, v: g.degree(u) + g.degree(v),
    # edge_size_range=(0.5, 5),
    #label_font="cursive",
    node_label_size=g.degree,
    #edge_label=edge_labels,
    #edge_color_gradient=("yellow", "red"),
    #clickable_edges=True,
    #max_categorical_colors=30,
    # hide_info_panel=True,
    # label_density=3,
)

I attache the html generated and a traceback which can help. test2.zip

Uncaught TypeError: URL constructor: ./@jupyter-widgets/html-manager/dist/libembed-amd.js is not a valid URL.
    <anonymous> https://cdn.jsdelivr.net/npm/@jupyter-widgets/html-manager@^1.0.1/dist/embed-amd.js:26
    <anonymous> https://cdn.jsdelivr.net/npm/@jupyter-widgets/html-manager@^1.0.1/dist/embed-amd.js:26
    execCb https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.4/require.min.js:1
    check https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.4/require.min.js:1
    enable https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.4/require.min.js:1
    enable https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.4/require.min.js:1
    enable https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.4/require.min.js:1
    bind https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.4/require.min.js:1
    each https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.4/require.min.js:1
    enable https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.4/require.min.js:1
    init https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.4/require.min.js:1
    o https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.4/require.min.js:1
    setTimeout handler*req.nextTick< https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.4/require.min.js:1
    o https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.4/require.min.js:1
    requirejs https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.4/require.min.js:1
    <anonymous> https://cdn.jsdelivr.net/npm/@jupyter-widgets/html-manager@^1.0.1/dist/embed-amd.js:29
    <anonymous> https://cdn.jsdelivr.net/npm/@jupyter-widgets/html-manager@^1.0.1/dist/embed-amd.js:29

[Yomguithereal]

@gsanou if this is not too risky, can I ask you to upgrade jupyterlab and ipywidgets, clear caches, relaunch kernels and see whether the issue still happens?

[gsanou]

@Yomguithereal, sure i can. I will retry and come back soon. Thanks you for the support.

[gsanou]

@Yomguithereal , I got the same error, i try different navigator and also i have test on google colab and it was the same results.

[Yomguithereal]

Ok, the error seems to be related to the dimensions of the container now. Can you try adding fullscreen=True to write_html or an explicit height kwarg alternatively?

For some weird reason, the ipywidget export deals badly with default arguments, I need to find a way to circumvent the problem when no height is given when embedding.

[gsanou]

you're right, the issue was the dimension exportation. Now its works. Thanks