Plotly Interactive Stacked barplot with Dash not returned

Question

I have the following dataframe (AllTransportModes_statistics_Tram) that I want to use to make an interactive barchart (this is a sample of it):

      ContractName DepartureLineTransportMode  DayGroupNumber  Year  Month  \
441   Lidingöbanan                       TRAM               1  2019      1   
442   Lidingöbanan                       TRAM               1  2019      2   
443   Lidingöbanan                       TRAM               1  2019      3   
444   Lidingöbanan                       TRAM               1  2019      4   
445   Lidingöbanan                       TRAM               1  2019      5   
1318     Tvärbanan                       TRAM               7  2020      5   
1319     Tvärbanan                       TRAM               7  2020      6   
1320     Tvärbanan                       TRAM               7  2020      7   
1321     Tvärbanan                       TRAM               7  2020      8   
1322     Tvärbanan                       TRAM               7  2020      9   

      count_nulls  count_rows  Percentage Null (%) (Imputated)  \
441             0        3710                              0.0   
442             0        3400                              0.0   
443             0        3570                              0.0   
444             0        3400                              0.0   
445             0        3570                              0.0   
1318           77        2479                              3.1   
1319          240        2120                             11.3   
1320          431        1247                             34.6   
1321          454        1688                             26.9   
1322           75        1634                              4.6   

      Percentage Null (%) (Non-imputated) Origin  
441                                  37.2   Both  
442                                  24.5   Both  
443                                  22.9   Both  
444                                  23.2   Both  
445                                  20.1   Both  
1318                                 63.3   Both  
1319                                 67.0   Both  
1320                                 83.5   Both  
1321                                 78.7   Both  
1322                                 78.0   Both

Now, what I wanted to do was to be able to pick three of the variables (ContractName, Year and DayGroupNumber) from a Dropdown list and the have grouped barplots for the variables Percentage Null (%) (Non-imputated) and Percentage Null (%) (imputated) for each Month (i.e. each group of bars has its month). So, to do so, I wrote the following code:

import dash
import dash_core_components as dcc
import dash_html_components as html
import plotly.graph_objs as go

Avtal_options = AllTransportModes_statistics_Tram["ContractName"].unique()
Year_options   =AllTransportModes_statistics_Tram["Year"].unique()
Dagtyp_options   =AllTransportModes_statistics_Tram["DayGroupNumber"].unique()

app = dash.Dash()

app.layout = html.Div([
    html.H2("Missing data"),
    html.Div(
        [
            dcc.Dropdown(
                id="ContractName",
                options=[{
                    'label': i,
                    'value': i
                } for i in Avtal_options],
                value='All ContractName'),
            dcc.Dropdown(
                id="Year",
                options=[{
                    'label': i,
                    'value': i
                } for i in Year_options],
                value='All Years'),
            dcc.Dropdown(
                id="DayGroupNumber",
                options=[{
                    'label': i,
                    'value': i
                } for i in Dagtyp_options],
                value='All DayGroupNumbers'),
        ],
        style={'width': '25%',
               'display': 'inline-block'}),
    dcc.Graph(id='funnel-graph'),
])

@app.callback(
    dash.dependencies.Output('funnel-graph', 'figure'),
    [dash.dependencies.Input('ContractName','value'),
    dash.dependencies.Input('Year','value'),
    dash.dependencies.Input('DayGroupNumber','value')])
    
def update_graph(ContractName,Year,DayGroupNumber):
    if (ContractName == "All ContractName" & Year == "All Years" & DayGroupNumber == "All DayGroupNumbers"):
        AllTransportModes_statistics_Tram_plot = AllTransportModes_statistics_Tram.copy()
    else:
        AllTransportModes_statistics_Tram_plot = AllTransportModes_statistics_Tram[(AllTransportModes_statistics_Tram['ContractName'] == ContractName) & (AllTransportModes_statistics_Tram['Year'].astype(str)==Year) & (AllTransportModes_statistics_Tram['DayGroupNumber'].astype(str)==DayGroupNumber)]

   
    trace1 = go.Bar(x=AllTransportModes_statistics_Tram_plot['Month'],y=AllTransportModes_statistics_Tram_plot['Percentage Null (%) (Imputated)'], name='Percentage Null (%) (Imputated)')
    trace2 = go.Bar(x=AllTransportModes_statistics_Tram_plot['Month'], y=AllTransportModes_statistics_Tram_plot['Percentage Null (%) (Non-imputated)'], name='Percentage Null (%) (Non-imputated)')
    return {
        'data': [trace1, trace2],
        'layout':
        go.Layout(
            title='Jämförelse saknad data'.format(ContractName).format(DayGroupNumber).format(Year),
            barmode='stack')
    }


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

As you can see, I have an option if no selection is done (the traces are plotted for all ContractNames, Years and DayGroupNumbers, otherwise the original df is filtered

if (ContractName == "All ContractName" & Year == "All Years" & DayGroupNumber == "All DayGroupNumbers"):
        AllTransportModes_statistics_Tram_plot = AllTransportModes_statistics_Tram.copy()
    else:
        AllTransportModes_statistics_Tram_plot = AllTransportModes_statistics_Tram[(AllTransportModes_statistics_Tram['ContractName'] == ContractName) & (AllTransportModes_statistics_Tram['Year'].astype(str)==Year) & (AllTransportModes_statistics_Tram['DayGroupNumber'].astype(str)==DayGroupNumber)]

It does NOT display anything apart from this

I just can't figure out what I am doing wrong. Any help would be appreciated. Thanks!

EDIT: Update to question

I have managed to solve parts of the question. What I now can manage is to make the graph update for the features Yearand DayGroupNumber with the following chages:

def update_graph(ContractName,Year,DayGroupNumber):
    if ((ContractName == "All ContractNames") & (Year == "All Years") & (DayGroupNumber == "All DayGroupNumbers")):
        AllTransportModes_statistics_Tram_plot = AllTransportModes_statistics_Tram.copy()
    
    elif ((ContractName == "All ContractNames") & (Year == "All Years")):
        AllTransportModes_statistics_Tram_plot = AllTransportModes_statistics_Tram[(AllTransportModes_statistics_Tram['DayGroupNumber'].astype(str)==DayGroupNumber)]
        
    elif ((ContractName == "All ContractNames") & (DayGroupNumber == "All DayGroupNumbers")):
        AllTransportModes_statistics_Tram_plot = AllTransportModes_statistics_Tram[(AllTransportModes_statistics_Tram['Year'].astype(str)==Year)]
    
    elif ((ContractName == "All Years") & (DayGroupNumber == "All DayGroupNumbers")):
        AllTransportModes_statistics_Tram_plot = AllTransportModes_statistics_Tram[(AllTransportModes_statistics_Tram['ContractName']==ContractName)]
                             
    elif ((ContractName == "All ContractNames")):
        AllTransportModes_statistics_Tram_plot = AllTransportModes_statistics_Tram[(AllTransportModes_statistics_Tram['Year'].astype(str)==Year) & (AllTransportModes_statistics_Tram['DayGroupNumber'].astype(str)==DayGroupNumber)]
    
    elif ((ContractName == "All Years")):
        AllTransportModes_statistics_Tram_plot = AllTransportModes_statistics_Tram[(AllTransportModes_statistics_Tram['ContractName']==ContractName) & (AllTransportModes_statistics_Tram['DayGroupNumber'].astype(str)==DayGroupNumber)]
                                            
    elif ((ContractName == "All DayGroupNumbers")):
        AllTransportModes_statistics_Tram_plot = AllTransportModes_statistics_Tram[(AllTransportModes_statistics_Tram['ContractName']==ContractName) & (AllTransportModes_statistics_Tram['Year'].astype(str)==Year)]
    
    trace1 = go.Bar(x=AllTransportModes_statistics_Tram_plot['Month'], y=AllTransportModes_statistics_Tram_plot['Percentage Null (%) (Imputated)'], name='Percentage Null (%) (Imputated)')
    trace2 = go.Bar(x=AllTransportModes_statistics_Tram_plot['Month'], y=AllTransportModes_statistics_Tram_plot['Percentage Null (%) (Non-imputated)'], name='Percentage Null (%) (Non-imputated)')

    return {
        'data': [trace1, trace2],
        'layout':
        go.Layout(
            title='Jämförelse saknad data'.format(ContractName),
            barmode ='group')
    }

However, the dropdown for ContractName doeas not work and, what's more, if I try to apply it first, then the two others don't work either. Also, the y-axis is not up to scale.

Serge de Gosson de Varennes · Accepted Answer · 2020-12-15 11:03:26Z

The solution to this problem is to cover all the possible cases of filters on the original dataframe, even the ones where no choices were made. Here is the full code:

import dash
import dash_core_components as dcc
import dash_html_components as html
import plotly.graph_objs as go

Avtal_options = AllTransportModes_statistics_Tram["ContractName"].unique()
Year_options   =AllTransportModes_statistics_Tram["Year"].astype(str).unique()
Dagtyp_options   =AllTransportModes_statistics_Tram["DayGroupNumber"].astype(str).unique()

app = dash.Dash()

app.layout = html.Div([
    html.H2("Saknade data för spårbunden trafik"),
    html.Div(
        [
            dcc.Dropdown(
                id="ContractName",
                options=[{
                    'label': i,
                    'value': i
                } for i in Avtal_options],
                value='All ContractNames'
            ),
            dcc.Dropdown(
                id="Year",
                options=[{
                    'label': i,
                    'value': i
                } for i in Year_options],
                value='All Years'
             ),
            dcc.Dropdown(
                id="DayGroupNumber",
                options=[{
                    'label': i,
                    'value': i
                } for i in Dagtyp_options],
                value='All DayGroupNumbers',
            ),
        ],
        style={'width': '25%',
               'display': 'inline-block'}),
     dcc.Graph(id='funnel-graph'),
    ])



@app.callback(
    dash.dependencies.Output('funnel-graph', 'figure'),
    [dash.dependencies.Input('ContractName','value'),
    dash.dependencies.Input('Year','value'),
    dash.dependencies.Input('DayGroupNumber','value')])
    
def update_graph(ContractName,Year,DayGroupNumber):
    if ((ContractName == "All ContractNames") & (Year == "All Years") & (DayGroupNumber == "All DayGroupNumbers")):
        AllTransportModes_statistics_Tram_plot = AllTransportModes_statistics_Tram.copy()
    
    elif ((ContractName == "All ContractNames") & (Year == "All Years")):
        AllTransportModes_statistics_Tram_plot = AllTransportModes_statistics_Tram[(AllTransportModes_statistics_Tram['DayGroupNumber'].astype(str)==DayGroupNumber)]
        
    elif ((ContractName == "All ContractNames") & (DayGroupNumber == "All DayGroupNumbers")):
        AllTransportModes_statistics_Tram_plot = AllTransportModes_statistics_Tram[(AllTransportModes_statistics_Tram['Year'].astype(str)==Year)]
    
    elif ((Year == "All Years") & (DayGroupNumber == "All DayGroupNumbers")):
        AllTransportModes_statistics_Tram_plot = AllTransportModes_statistics_Tram[(AllTransportModes_statistics_Tram['ContractName']==ContractName)]
                             
    elif ((ContractName == "All ContractNames")):
        AllTransportModes_statistics_Tram_plot = AllTransportModes_statistics_Tram[(AllTransportModes_statistics_Tram['Year'].astype(str)==Year) & (AllTransportModes_statistics_Tram['DayGroupNumber'].astype(str)==DayGroupNumber)]
    
    elif ((Year == "All Years")):
        AllTransportModes_statistics_Tram_plot = AllTransportModes_statistics_Tram[(AllTransportModes_statistics_Tram['ContractName']==ContractName) & (AllTransportModes_statistics_Tram['DayGroupNumber'].astype(str)==DayGroupNumber)]
                                            
    elif ((DayGroupNumber == "All DayGroupNumbers")):
        AllTransportModes_statistics_Tram_plot = AllTransportModes_statistics_Tram[(AllTransportModes_statistics_Tram['ContractName']==ContractName) & (AllTransportModes_statistics_Tram['Year'].astype(str)==Year)]
    
    elif ((ContractName != "All ContractNames") & (Year != "All Years") & (DayGroupNumber != "All DayGroupNumbers")):
        AllTransportModes_statistics_Tram_plot = AllTransportModes_statistics_Tram[(AllTransportModes_statistics_Tram['ContractName']==ContractName) & (AllTransportModes_statistics_Tram['Year'].astype(str)==Year) & (AllTransportModes_statistics_Tram['DayGroupNumber'].astype(str)==DayGroupNumber)]
        
    trace1 = go.Bar(x=AllTransportModes_statistics_Tram_plot['Month'], y=AllTransportModes_statistics_Tram_plot['Percentage Null (%) (Imputated)'], name='Percentage Null (%) (Imputated)')
    trace2 = go.Bar(x=AllTransportModes_statistics_Tram_plot['Month'], y=AllTransportModes_statistics_Tram_plot['Percentage Null (%) (Non-imputated)'], name='Percentage Null (%) (Non-imputated)')

    return {
        'data': [trace1, trace2],
        'layout':
        go.Layout(
            title='Jämförelse saknad data'.format(ContractName),
            barmode ='group')
    }


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

which return the right barplots

Collectives™ on Stack Overflow

Plotly Interactive Stacked barplot with Dash not returned

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related