Hello! I’m new to python and dash and trying to make an animated chart. I have a graph object scatter and it is animated. It works by clicking on the “play” button as shown in many examples. But is there a way to start animation without a button, e.g. some autoplay property? Here is example:
import dash
import dash_core_components as dcc
import dash_html_components as html
import pandas as pd
import plotly.express as px
import plotly.graph_objs as go
df = pd.DataFrame(index=range(0,49),columns=['x','y'])
df['x']=['00:00', '00:30', '01:00', '01:30', '02:00', '02:30', '03:00', '03:30', '04:00', '04:30', '05:00', '05:30', '06:00', '06:30', '07:00', '07:30', '08:00', '08:30','09:00', '09:30',
'10:00', '10:30', '11:00', '11:30', '12:00', '12:30', '13:00', '13:30', '14:00', '14:30', '15:00', '15:30', '16:00', '16:30', '17:00', '17:30', '18:00', '18:30','19:00', '19:30',
'20:00', '20:30', '21:00', '21:30', '22:00', '22:30', '23:00', '23:30', '24:00']
df['y']=[396, 365, 317, 415, 495, 353, 493, 413, 472, 335, 305, 465, 425, 401, 466, 476, 400, 473, 365, 406, 345, 439, 325, 367, 445, 478, 406, 469, 384, 468, 370, 328, 445, 376, 355, 377,
361, 324, 426, 413, 454, 479, 324, 498, 386, 438, 330, 309, 424]
fig1Slide1 = go.Figure(data=[go.Scatter(x=df['x'][:0],
y=df['y'][:0],
mode='lines',
line = dict(color='rgb(214,40,40)',width=1),
fill='tozeroy',
fillcolor='rgba(236,156,156,0.5)')])
fig1Slide1.update(frames=[go.Frame(data=[
go.Scatter(x=df['x'][:k],
y=df['y'][:k])])for k in range(0,49)])
fig1Slide1.update_layout(updatemenus=[dict(type="buttons", buttons=[dict(label="Play",method="animate",args=[None, {"frame": {"duration": 30}}])])] )
app = dash.Dash(__name__)
app.layout = html.Div([
dcc.Graph(figure=fig1Slide1)
])
if __name__ == '__main__':
app.run_server(debug=True)