Interval
Clock
  • Update components on a predefined interval
    1. import datetime
    2.  
    3. import dash
    4. from dash import dcc
    5. from dash import html
    6. import plotly
    7. from dash.dependencies import Input, Output
    8.  
    9. external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']
    10.  
    11. app = dash.Dash(__name__, external_stylesheets=external_stylesheets)
    12. app.layout = html.Div(
    13. html.Div([
    14. html.Div(id='live-update-text'),
    15. dcc.Interval(
    16. id='interval-component',
    17. interval=1*1000, # 1s = 1000 milliseconds
    18. n_intervals=0 # number of times the interval has passed
    19. )
    20. ])
    21. )
    22.  
    23. @app.callback(Output('live-update-text', 'children'),
    24. Input('interval-component', 'n_intervals'))
    25. def update_metrics(n):
    26. current = datetime.datetime.now()
    27. s, m, h = current.second, current.minute, current.hour
    28. style = {'padding': '5px', 'fontSize': '16px'}
    29. return html.Span('{:d}:{:d}:{:d}'.format(h, m, s)),
    30.  
    31. if __name__ == '__main__':
    32. app.run_server(debug=True)