N_intervals property doesn't update my table

Dash Python
1

Hello,

I’m trying to create an application (using n_interval property) to monitor a log file which is constantly gets updated and get the dataframe through uploaded_jobs() function, and as the log file gets updated, my application would update the data in the table and the graph.
Currently, my graph gets updated but my table doesn’t get updated unless I manually run the code.

Below is my code, I’d appreciate your help (I’ve read almost all the posts related to ‘live update’ but couldn’t figure out my problem).

import dash
from dash import Dash, html, dash_table, dcc, callback, Input, Output
import pandas as pd
import plotly.express as px
from datetime import timedelta, datetime
from uploaded_jobs_past6hrs import *
import plotly.graph_objects as go
import os
from dash.exceptions import PreventUpdate

df = uploaded_jobs()

app = dash.Dash(__name__)

app.layout = html.Div([
    html.Div(children='Total number of ' + str(len(df)) +
             ' job(s) have been uploaded over the past 6 hours', id='update-text'),
    html.Div([       
        dash_table.DataTable(df.to_dict('records'), [
                             {"name": i, "id": i} for i in df.columns], id='data-table'),

        dcc.Graph(id='uploaded-jobs-graph', figure=px.histogram(df, x='Upload_Time', y='Job_ID',
                                                                hover_data=['Job_ID', 'Upload_Time'], color='Job_ID', barmode="group", histfunc='count')),
        dcc.Interval(id='interval-component', interval=60*1000,  # in milliseconds
                     n_intervals=0)
    ])], id='container')


@app.callback([Output('uploaded-jobs-graph', 'figure'),
               Output('data-table', 'children')],
              [Input('interval-component', 'n_intervals')])
def multi_output(n_intervals):
    df_updt = uploaded_jobs()
    figure  = px.histogram(df_updt, x='Upload_Time', y='Job_ID', hover_data=[
        'Job_ID', 'Upload_Time'], color='Job_ID', barmode="group", histfunc='count')

    table = dash_table.DataTable(df_updt.to_dict('records'), [
        {"name": i, "id": i} for i in df_updt.columns], id='data-table')

    return figure, table


if __name__ == '__main__':
    app.run_server()
2

Hi,

I guess you might need to return an array in your interval function reply or remove the array from the function arguments

Regards
J.

3

Hi jcuypers,

Could you please be more specific about where and how to return an array (maybe kindly provide an example)? Are you referring to the callback function? I’m quite new to plotly and python.

4

hi, i missed the ball myself :slight_smile:

Anyway i think the issue is that you are using the children parameter where it needs to be data…
So according to me, you need to use the following

@app.callback([Output('uploaded-jobs-graph', 'figure'),
               Output('data-table', 'data')],
              [Input('interval-component', 'n_intervals')])

children would be used in case you have a div and you want to replace a complete table inside of it…
in your case you reference a table instead of a div so you need to reference the data of it.
(similar as that you reference ‘figure’ for the graph instead of children.

reg,
J.

1 Like
5

Thanks jcuypers! I tried your suggestion by replacing ‘children’ with ‘data’ but no changes. My table is still not getting updated. :confused:

6

Hi,

Yes, probably because I forgot to mention that when you only want to update the data of the table, you only need to return the data and not the whole table.

@app.callback([Output('uploaded-jobs-graph', 'figure'),
               Output('data-table', 'data')],
              [Input('interval-component', 'n_intervals')])
def multi_output(n_intervals):

    df_updt = uploaded_jobs()
    figure  = px.histogram(df_updt, x='Upload_Time', y='Job_ID', hover_data=[
        'Job_ID', 'Upload_Time'], color='Job_ID', barmode="group", histfunc='count')

    table = df_updt.to_dict('records')
        
    return figure, table

reg,
J.

1 Like
7

Thanks so much! This solved the problem. :slight_smile:

1 Like