In col2, I need to show a graph by calling python package pyvis and when create a graph, width and height pixel are grauments for pyvis. How can I read the current width and height pixel of col2, so that the graph can fit the screen no matter what the device is.
Hey @zhiyuanpeng , I looked at your website and here is a small fix that can work for you… and for this you also dont need to calculate the width of columns every time …
I read your html in inspect mode and so, the width of container inside center column can be set to inherit and it will always be of the same size as of the center column.
So you can add the following snippet into your code on top of every thing …
@ilovetensor Thanks for your solution. I update the website and currently the contents of three column will not overlap if the window size changes. But I still need to read the current column width as the width is an argument for pyvis when creating a graph:
import streamlit as st
from pyvis.network import Network
import networkx as nx
import pickle
from os.path import exists
import json
from ast import literal_eval
import pprint
def create_pgm_from_pickles(nt_file: str, nx_file: str, pgm_type: str,
h: str, w: str, hier: bool):
"""
load pgm from pickles if pickle file exists
:param nt_file: pickle file of nt_pgm
:param nx_file: pickle file of nx_pgm
:param pgm_type: Directed or Undirected
:param h: height
:param w: width
:param hier: hiericial or not
:return: return the nt and nx pgm. nx pgm communicate with UI. nt is to
show pgm
"""
if exists(nt_file) and exists(nx_file):
return (pickle.load(open(nt_file, "rb")), pickle.load(open(nx_file,
"rb")))
else:
return (Network(directed="True", height=h, width=w, layout=hier),
nx.DiGraph()) if pgm_type == "Directed" else \
(Network(height=h, width=w, layout=hier), nx.Graph())
Currently, I set width 900 and it looks good for my 25-inch screen, but on bigger screen like 28-inch, there should be a gap between the graph and the right column. Do you know how I can fix it? Thanks a lot!