ChrisDelClea / streamlit-agraph

A Streamlit Graph Vis
MIT License
387 stars 52 forks source link

Version 0.0.40 Breaks configs for nodes/labels/d3 #30

Closed ssh-randy closed 1 year ago

ssh-randy commented 2 years ago

Was experimenting around with this library when I found an issue introduced in version 0.0.40. Works in 0.0.37, screenshots below. Seems like some change made in version 0.0.40 causes nodes to not display labels. Unsure if it's actually because of configs or not, might be that some node properties can hardcoded (configs don't seem to work, even though the default label is supposed to be id).

code sample showing how I passed in the configs (same code ran on both versions):


def app():
  st.title("Graph Example")
  st.sidebar.title("Welcome")
  # query_type = st.sidebar.selectbox("Query Tpye: ", ["Nobel Prizes", "blabla"]) # could add more stuff here later on or add other endpoints in the sidebar.
  node_config = {
    'labelProperty' : 'label',
    'renderLabel' : 'true'
    }
  st.write("Node config: " + str(node_config))
  config = Config(height=2000, 
                  width=1000, 
                  nodeHighlightBehavior=True, 
                  highlightColor="#F7A7A6", 
                  directed=True,
                  collapsible=True,
                  node = node_config,
                  # d3 = {'linkLength' : 6000}
                )

  # st.write("Node config d3: " + str(config.d3))
  st.subheader("Nobel Prizes")
  with st.spinner("Loading data"):
    nodes, edges = get_inspired()
    st.write("Nodes loaded: " + str(len(nodes)))
  st.success("Done")
  agraph(nodes=nodes, edges=edges, config=config)

if __name__ == '__main__':
    app()

image

image

ChrisDelClea commented 2 years ago

hey @ssh-randy, this is an error I have already noticed as well. According to the documentation, you can use the shape of the node to determine where the label is displayed: The label is the piece of text shown in or under the node, depending on the shape. Can you experiment a bit with it and let me know with which shape it works?

ChrisDelClea commented 2 years ago

@ssh-randy , i tested your scenario and actually I forgot to add the label on the node as property. So if you do the following:

nodes.append(Node(id=node["hero"], title=node["link"], label=node["hero"], shape="circularImage", image=node["img"])) #circularImage

you would get the labels on the node. Please notice as I said above, depending on the shape of the node determines where the label will be displayed. Does this solve your issue?

EDIT: Please update to 0.0.42