Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Hidding annotations in Plotly/Python using a button

So I have constructed a network plot using Plotly. The output is fine. Now I wanted to add labels per each node of the network. In order to do so I used the Plotly annotations. pos holds the positions as {node_id:(x,y)} for every node in the network; G is my networkx graph.

layoutAnnotationList = []
for  k,p in pos.items():
    x = p[0]
    y = p[1]
    try:
        text = G.node[k]['hostname']
    except:
        text = k
    layoutAnnotationList.append( { 'x':x, 'y':y, 'text':text } )

After this I added the list layoutAnnotationList to the layout itself.

layout = { 'annotations': layoutAnnotationList } 

Now, I've read this on how to add buttons to the layout, using the relayout method, but I really don't understand how to make those buttons to show or hide the annotations.

I created a layoutButtons list, I got to show them on the webpage, but I'm clueless regarding their functioning.

layout = { 'annotations': layoutAnnotationList, 'updatemenus':layoutButtons }

enter image description here

Any hint on how to use those?

Thanks!

like image 605
Lucas Aimaretto Avatar asked Dec 03 '25 15:12

Lucas Aimaretto


1 Answers

So, after reading carefully, the solution is to use the update method when creating the buttons.

layoutButtons = list([
                dict(type="buttons",
                     active=-1,
                     buttons=list([   
                        dict(label = 'Label:On',
                             method = 'update',
                             args = [{'visible': [True, True, True, True]},{'annotations':layoutAnnotationList}]
                             ),
                        dict(label = 'Label:Off',
                             method = 'update',
                             args = [{'visible':[True, True, False, False]},{'annotations':[]}]
                             ),
                            ]
                        )
                     )
                ]   
            )

I've got the idea from here. Still do not know how to interpret the {'visible':[True, True, False, False]} dictionary inside the arguments, but it's working.

like image 103
Lucas Aimaretto Avatar answered Dec 05 '25 18:12

Lucas Aimaretto



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!