Network Display Test¶
Author: Pinn Xu
Date: July 12, 2026
Goal: To display network diagram both in Google Colab and exported notebook HTML file, without requirement of a separate net.html.
Define Network Diagram¶
In [51]:
# import libraries
import networkx as nx
from pyvis.network import Network
from IPython.display import IFrame, HTML, display
# create an empty network relation
gx = nx.MultiDiGraph()
# add nodes and edges
gx.add_edge('a','b')
gx.add_edge('b','d')
gx.add_edge('c','e')
gx.add_edge('e','a')
gx.add_edge('c','d')
Display Network Diagram¶
Solution: Formatting HTML¶
Don't specify parameters when calling Network(), then format the diagram's code and show it as output using display().
This method works well in all occasions, even in VS Code.
In [56]:
# create an empty network diagram
gp = Network() # don't specify parameters
# add network relation to the diagram
gp.from_nx(gx)
# store whole html code of the network diagram
html = gp.generate_html()
# format: only use double quotes
html_formatted = html.replace("'",'"')
# defining iframe tag
iframe_start = """
<iframe
style='display:block; margin:0px; width:100%; height:600px'
frameborder='0'
srcdoc='
"""
iframe_end = " '></iframe> "
# wrap formatted html code with iframe tag
html_wrapped = iframe_start + html_formatted + iframe_end
# display
display(HTML(html_wrapped))
Other Methods: All Have Drawbacks¶
Specify notebook and cdn_resources parameters when calling Network().
In [58]:
# create an empty diagram
gp = Network(
notebook=True,
cdn_resources="in_line",
height="600px",
width="100%",
)
# add network relation to the diagram
gp.from_nx(gx)
gp.generate_html()plusdisplay()render the diagram as output in Colab without generating external files, but doesn't work in exported notebook HTML file.gp.show("net.html")itself render diagram output in Jupyter, whereas not working in Colab.- Using
gp.save_graph("net.html")orgp.show("net.html")plusdisplay(HTML("net.html"))renders output correctly in Colab, but it relies on the separatenet.htmlfile.
In [47]:
# work in Colab but not exported notebook HTML file
display(HTML(gp.generate_html()))