sd1315
December 3, 2020, 4:05pm
1
Hi,
I am trying to create a scatter plot where I have used color attributes of Plotly express. I want to add a dropdown with the columns which can be pass as โcolorโ attributes.
My try:
Test1
Test2
Test5
Test3
Test4
0.97
60.200001
58.279999
A
0
1.32
60.200001
58.279999
B
0
1.52
59.509998
60.93
C
0
1.72
59.509998
60.93
A
0
1.92
59.509998
60.93
B
0
2.12
59.509998
60.93
C
0
2.32
61.110001
66.029999
A
0
2.52
61.110001
66.029999
B
0
2.72
61.110001
65.279999
C
0
2.92
61.110001
65.279999
A
0
3.12
61.110001
61.98
B
1
3.32
60.98
61.98
C
1
3.52
60.98
61.98
A
1
3.72
61.779999
61.759998
B
1
3.92
61.779999
61.759998
C
1
4.12
61.509998
58.029999
A
1
4.32
61.509998
58.029999
B
1
4.52
61.509998
57.900002
C
1
df = pd.read_csv('plottest.csv')
df['Test4'] = df['Test4'].astype(str)
import plotly.express as px
import plotly.graph_objects as go
fig = px.scatter(df,x= "Test1", y="Test2",color="Test3")
collist =['Test3','Test4']
buttonlist = []
for col in collist:
buttonlist.append(
dict(
args=['color',[df[str(col)]]],
label=str(col),
method='restyle'
)
)
fig.update_layout(
title="Test data",
yaxis_title="s",
xaxis_title="activity",
# Add dropdown
updatemenus=[
go.layout.Updatemenu(
buttons=buttonlist,
direction="down",
pad={"r": 10, "t": 10},
showactive=True,
x=0.1,
xanchor="left",
y=1.1,
yanchor="top"
),
],
autosize=True
)
fig.show()
Why it is not reflecting the changes?? is the โcolorโ attributes not supported in restyle method??
Hi @sd1315 ,
at first glance i would suggest this:
args=['marker.color',[df[str(col)]]]
but I did not check if it works like this
sd1315
December 8, 2020, 9:01am
3
Hi @Alexboiboi I tried as you guided. But not the expected Results which I am looking for.
Initially it is showing Correct with Proper Legend
After changing DropDown it is changing the color but not the correct. Also Legend is not changing
If I go back to previous one it is not showing the previous one and not showing the correct color.
I am sharing Proper Data with actual naming. Please let me know where I am doing wrong.
X
Y
Chamber
Status
0.97
60.200001
A
0
1.32
60.200001
B
0
1.52
59.509998
C
0
1.72
59.509998
A
0
1.92
59.509998
B
0
2.12
59.509998
C
0
2.32
61.110001
A
0
2.52
61.110001
B
0
2.72
61.110001
C
0
2.92
61.110001
A
0
3.12
61.110001
B
1
3.32
60.98
C
1
3.52
60.98
A
1
3.72
61.779999
B
1
3.92
61.779999
C
1
4.12
61.509998
A
1
4.32
61.509998
B
1
4.52
61.509998
C
1
import pandas as pd
df = pd.read_csv('plottest.csv')
df['Status'] = df['Status'].astype(str)
import plotly.express as px
import plotly.graph_objects as go
fig = px.scatter(df,x= "X", y="Y",color="Status")
updatemenus = [{'buttons': [{'method': 'update',
'label': 'Status',
'args': [
{'marker.color':[df["Status"]] }
]
},
{'method': 'update',
'label': 'Chamber',
'args': [
{'marker.color':[df["Chamber"]] }
]
}],
'direction': 'down',
'showactive': True,}]
fig.update_layout(updatemenus=updatemenus)
fig.show()
Method Restyle is also not working. Can you help me on this.? Thanks in advance.
Is your goal to have the dropdown switch between the following 2 plots:
and
I so, I think there is a misunderstanding of what plotly.express
does.
1 Like
the restyling via the update menus will only redefine the color via an array of colors you provide. When using the color
argument in plotly.express
you will just tell plotly by which parameter to separate your traces. In the first plot you have 2 traces and in the second you have 3 traces.
sd1315
December 8, 2020, 1:13pm
6
Thanks @Alexboiboi , Yes you are right. I actually want that two Plot in the DropDown. I tried to using Plotly express as it gives me direct color variable inclusion. Except using Dash is there any option to achieve that??
you could use IPywidgets or panel but this will only work with a python kernel running, or you implement callbacks in javascript.