-
-
Notifications
You must be signed in to change notification settings - Fork 120
/
usage-context-menu.py
79 lines (72 loc) · 2.02 KB
/
usage-context-menu.py
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
import dash
import dash_cytoscape as cyto
import dash_html_components as html
from dash import callback, Input, Output, html
import dash_core_components as dcc
contextMenuItems = {
"add-node": {
"id": "add-node",
"label": "Add Node (JS)",
"tooltipText": "Add Node",
"onClick": "add_node",
"availableOn": ["canvas"],
},
"remove": {
"id": "remove",
"label": "Remove (JS)",
"tooltipText": "Remove",
"availableOn": ["node", "edge"],
"onClick": "remove",
},
"add-edge": {
"id": "add-edge",
"label": "Add Edge (JS)",
"tooltipText": "add edge",
"availableOn": ["node"],
"onClick": "add_edge",
},
}
app = dash.Dash(__name__)
app.layout = html.Div(
[
cyto.Cytoscape(
id="cytoscape",
elements=[
{
"data": {"id": "one"},
"position": {"x": 50, "y": 50},
},
{
"data": {"id": "two"},
"position": {"x": 200, "y": 200},
},
{"data": {"source": "one", "target": "two"}},
],
layout={"name": "preset"},
stylesheet=[
{
"selector": "edge",
"style": {
"target-arrow-color": "grey",
"target-arrow-shape": "vee",
"curve-style": "straight",
},
},
{"selector": "node", "style": {"label": "data(label)"}},
],
),
dcc.Dropdown(
options=[{"label": l, "value": l} for l in contextMenuItems.keys()],
id="dropdown",
),
]
)
@callback(
Output("cytoscape", "contextMenu"),
Input("dropdown", "value"),
prevent_initial_call=True,
)
def update_output(dropdown_value):
return [contextMenuItems[dropdown_value]]
if __name__ == "__main__":
app.run_server(debug=True)