Pyvis rendering blank html

Question

I am pretty new to network analysis, but I have managed to create a viable graph in Networkx that basically gives me what I need in most of the cases. I recently heard about Pyvis and it looked like it would be a very nice way of visualizing my graphs.

I do however have a problem that I can't seem to find any answers for: Pyvis only renders a blank html when i try this (some example I found online):

from pyvis.network import Network
import networkx as nx

nx_graph = nx.cycle_graph(10)
nx_graph.nodes[1]['title'] = 'Number 1'
nx_graph.nodes[1]['group'] = 1
nx_graph.nodes[3]['title'] = 'I belong to a different group!'
nx_graph.nodes[3]['group'] = 10
nx_graph.add_node(20, size=20, title='couple', group=2)
nx_graph.add_node(21, size=15, title='couple', group=2)
nx_graph.add_edge(20, 21, weight=5)
nx_graph.add_node(25, size=25, label='lonely', title='lonely node', group=3)
nt = Network('500px', '500px')

# populates the nodes and edges data structures
nt.from_nx(nx_graph)
nt.show('nx.html')

I should get this output:

pyvis graph

But all I get is this:

enter image description here

Extra info: I use Jupyter Notebook in a production environment that does not have internet connection.

Thanks in advance for any help :)

Well. I got this to work on my own computer, which has an internet connection. When I went offline I replicated the problem I posted (Which I got on my work computer). I guess an internet connection might be needed for some reason? — Khoin, Aug 03 '22 at 20:58
I dont think you need an internet connection, could you export the html file and open it on another computer? Send by mail etc… — AveragePythonEnjoyer, Aug 03 '22 at 22:03
I transferred the html-file to another computer that doesn't have any restrictions on internet and such and - viola! - It works. Still, I don't really understand why it doesn't render in my notebook, but... Thanks :) — Khoin, Aug 04 '22 at 07:00
I don't know how pyvis renders the graph, but perhaps it uses a JavaScript library that is loaded from a CDN. If that's the case, then the HTML output will only show up when you have a web connection to reach that CDN. — Robert Haas, Aug 12 '22 at 20:15
A little update: Robert Haas was correct. It does load from a CDN. I solved my problem by editing the HTML that Pyvis produces to use locally stored vis.js-files. Thanks! :) — Khoin, Aug 16 '22 at 07:24

score 3 · Answer 1 · answered Aug 21 '22 at 16:31

I'm the author of gravis, a Python package for network visualization that uses web technologies (HTML/CSS/JS) for rendering in a browser. Given your requirements, it seems to be a good alternative: 1) it has support for inline plotting in Jupyter notebooks and 2) it does not require a web connection since it doesn't fetch anything from a CDN but embeds all JS code directly in the output HTML.

Here I've reproduced your example:

import gravis as gv
import networkx as nx

g = nx.cycle_graph(10)
g.graph['node_color'] = 'blue'
g.nodes[1]['title'] = 'Number 1'
g.nodes[1]['group'] = 1
g.nodes[3]['title'] = 'I belong to a different group!'
g.nodes[3]['group'] = 10
g.nodes[3]['color'] = 'orange'
g.add_node(20, size=20, title='couple', group=2, color='red')
g.add_node(21, size=15, title='couple', group=2, color='red')
g.add_edge(20, 21, weight=5)
g.add_node(25, size=25, label='lonely', title='lonely node', group=3, color='green')

gv.d3(g)

This is how it looks like when being used in a notebook after dragging the nodes a bit manually to mimic the layout in your image. Edges can also be colored, so the yellow edge could be reproduced as well if that's desired:

Pyvis rendering blank html

1 Answers1

Linked