So I have been trying to achieve the function that a table will automatically update based on two dcc.Input boxes. So there are two input boxes, one is minimum value and the other is maximum value. I try to update the table in the callback function update_graph_min, trying to use pandasql. But the table won't update and I cannot figure out why. Here is a snippit of my code:
from dash import Dash, html, dcc, callback, Output, Input, dash_table
import plotly.express as px
import pandas as pd
from dash.dependencies import Output, State, Input
import pandasql as ps
df = pd.read_csv('C:\\Users\\PENGYUANZHANG\\PycharmProjects\\pythonProject5\\Data\\Mantas_test.csv')
df = df.iloc[:100]
app = Dash(
__name__,
meta_tags=[{"name": "viewport", "content": "width=device-width, initial-scale=1"}],
)
app.title = "Hub and Spoke Dashboard"
server = app.server
app.config.suppress_callback_exceptions = True
df = pd.read_csv('C:\\Users\\PENGYUANZHANG\\PycharmProjects\\pythonProject5\\Data\\Mantas_test.csv')
df = df.iloc[:100]
colors = {'background': '#111111', 'text': '#7FDBFF'}
def generate_table(dataframe):
return dash_table.DataTable(id='mantas-table',
data=dataframe.to_dict('records'),
page_size=20,
style_data={'color': colors['text']},
style_header={'color': colors['text']},
style_cell={'color': colors['background']}),
app.layout = html.Div(style = {'backgroundcolor': colors['background']}, children=[
html.H1(children='Mantas transactions', style={'textAlign': 'center', 'color': colors['text'], 'fontSize': 30}),
html.Hr(),
"Minimum Originator Amount: ",
dcc.Input(id='am_min', type='number', min=0, step=500, placeholder='Min Orig Amount'),
"\n",
"Maximum Originator Amount: ",
dcc.Input(id='am_max', type='number', max=100000000, step=500, placeholder='Max Orig Amount'),
html.Hr(),
dcc.RadioItems(options=['ORIG_TRXN_ACTVY_AM', 'BENEF_TRXN_ACTVY_AM', 'SEND_TRXN_ACTVY_AM'], value='ORIG_TRXN_ACTVY_AM', id='controls-and-radio-item'),
dash_table.DataTable(id='mantas-table', data=df.to_dict('records'), page_size=20, style_data={'color': colors['text']}, style_header={'color': colors['text']}, style_cell={'color': colors['background']}),
dcc.Graph(figure={}, id='controls-and-graph')
])
@callback(
Output('controls-and-graph', 'figure'),
Input('controls-and-radio-item', 'value')
)
def update_graph_radio(col_chosen):
fig = px.histogram(df, x='ORIG_NM', y=col_chosen, histfunc='avg')
fig.update_layout(
plot_bgcolor=colors['background'],
paper_bgcolor=colors['background'],
font_color=colors['text']
)
return fig
@callback(
Output('mantas_table', 'data'),
[Input('am_min', 'value'),
Input('am_max', 'value')],
prevent_initial_call=True
)
def update_graph_min(am_min, am_max):
query = "Select * from df where df.ORIG_TRXN_ACTVY_AM < " + str(am_max) + "and df.ORIG_TRXN_ACTVY_AM > " + str(am_min)
new_df = ps.sqldf(query, locals())
return new_df.to_dict('records')
if __name__ == '__main__':
app.run(debug=True)
Can anyone help me with this please