Reputation: 608
Let us say, I have the following table.
df
source target Weight
A B 10
A C 8
C F 8
B F 6
F D 6
B E 4
I able to manage to plot it using networkx
library. AND I would like to also give a try using Dash Cytoscope
component.
I have tried the following. But not succeed yet.
app.layout = html.Div([
html.Div([
cyto.Cytoscape(
id='org-chart',
autoungrabify=True,
minZoom=0.2,
maxZoom=1,
layout={'name': 'breadthfirst'},
style={'width': '100%', 'height': '500px'},
elements=
[
# Nodes elements
{'data': {'id': x, 'label': x}} for x in df.name
]
+
[
# Edge elements
{'data': {'source': df['source'], 'target': df['target']}},
]
)
], className='six columns'),
html.Div([
html.Div(id='empty-div', children='')
],className='one column'),
], className='row')
Any help is appreciated on this.
Upvotes: 0
Views: 1267
Reputation: 83
The problem is that you tried to define your edges using the entire data frame columns instead of iterating it (as you did for the nodes). Have you tried the below code ?
edges = [{'data': {'source': x, 'target': y}} for x,y in zip(df.source,df.target)]
Upvotes: 1