Problem with connecting Datatable to Line chat

Dash Python
1

@marquymarc

Hi everyone,

I am not familiar with Dash and python, I am trying to run a Test code that will help me improve the app I am trying to build, I want to connect what’s in the datatable to build a Line chart and I would like the graph to take only into account the data in the rows within the “Crediting Period” which is in the Slider.

Unfortunately , the app is not working

Here is the code:

df = pd.read_csv('bijour.csv')

app.layout = dbc.Container([
    
    dcc.Slider(
                        id='Crediting_period',
                        marks={
                            10: '10 years',
                            30: '30 years',
                            },
                        step=1,
                        tooltip= {'always_visible': True},
                        min=10,
                        max=30,
                        value=15,
                        dots=False,
                        vertical = True,
                        updatemode='drag'
                    ),                    
    
    dcc.Graph(
        id='our_graph'),
    
    dash_table.DataTable(
                    id='table',
                    columns=[{"name":i, "id":i} for i in df.columns],
                    data=df.to_dict('records'),
                    editable=True,
                    style_table={'height': '450px', 'overflowY': 'auto'}
    )
]
)

@app.callback(
    Output(component_id='our_graph', component_property='figure'),
    [Input(component_id='table', component_property='data'),
     Input(component_id='Crediting_period', component_property='value')]
)

def update_graph(rows, m):
    
    dff = pd.DataFrame(rows)
    
    fig = px.line(dff, x=[int(dff.columns[0]) for x in range (0, m)], y=dff.columns[1])
    
    
    return fig     


if __name__ == '__main__':
    app.run_server(debug=False)

and here is the CSV file:

image
image385×760 5.68 KB

2

Hi @marquymarc

Review how you are using pc.line structure:

Something like this works:

       fig = px.line(dff, x="x", y="tCO2_sequestrated")

But I don’t know what you want to accomplish :thinking: