Select single value from drop down list

Dash Python
1

When I select multi='False", I get blank chart. Please fix error in below code. I want only one input value in the drop down list and its corresponding data on the chart.

2
21920×1036 44.7 KB 

import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output
import plotly.graph_objs as go
import pandas as pd

df = pd.read_csv("full_grouped.csv")



app = dash.Dash(__name__,)
app.layout = html.Div([

    html.Div([
    html.H1('Covid 19 Dashboard from 5/1/2020 - 7/28/2020')],
    style={'text-align': 'center'

    }),

    html.Div([
        dcc.Dropdown(id='countries_name',
                     multi=False,
                     clearable=True,
                     value='Afghanistan',
                     placeholder='Select Countries',
                     options=[{'label': c, 'value': c}
                              for c in (df['Country'].unique())])

    ], style={'width': '40%',
              'margin-left': '30%',
              # 'background-color': '#2EBECD'
              }),
    html.Div([
    dcc.Graph(id='countries_new_cases',
              config={'displayModeBar': True})

        ],style={'margin-left':'23%','margin-top':'1%'})


  ])
@app.callback(Output('countries_new_cases', 'figure'),
              [Input('countries_name', 'value')])
def annual_by_country_barchart(states_usa):


    return {
        'data': [go.Bar(x=df[df['Country'] == c]['Date'],
                        y=df[df['Country'] == c]['New cases'],

                        textposition='auto',

                        name=c)
                        for c in states_usa],


         'layout': go.Layout(
             # title='List of States: ' + ', '.join(states_usa),

            # plot_bgcolor='#323259',
            # paper_bgcolor='#323259',

            font={'family': 'Palatino'},
            width=1050,
            height = 520,
             barmode='stack',
             template='plotly_white',
             yaxis=dict(
                 title='New Cases',
                 titlefont_size=18,
                 tickfont_size=14,
             ),
             xaxis=dict(
                 title='Date',
                 titlefont_size=18,
                 tickfont_size=14,
             ),

         )

    }



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

Hi @jawabutt
Welcome to the Dash community.

Inside your callback function, try print(type(states_usa))

You see you get a str type. Which is why you cant do list comprehension below.

[for c in states_usa]
3

Thank you for your reply.
Sir, my problem not solved.
I share code and google drive link for data. I want to display bar chart with single input in drop down list. when I select (multi=True),I see data on bar chart and when I select (multi=False), I see bar chart nothing display any data. Please fix this code with single value in drop down list or (multi=False).

I shall be very thankful to you.

Data file google drive link
https://drive.google.com/file/d/1Yk1DeAKlA8eVDKlH_1A2EgTSwRQ812sQ/view?usp=sharing

import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output
import plotly.graph_objs as go
import pandas as pd

df = pd.read_csv("USA prisoner data.csv")

# Create bar chart with drop down list


app = dash.Dash(__name__,)
app.layout = html.Div([

    html.Div([
    html.H1('USA States Prisoner Statistics Data 2001-2016')],
    style={'text-align': 'center'

    }),

    html.Div([
        dcc.Dropdown(id='states_usa',
                     multi=True,
                     clearable=True,
                     value=['ALABAMA','ALASKA'],
                     placeholder='Select Countries',
                     options=[{'label': c, 'value': c}
                              for c in (df['jurisdiction'].unique())])

    ], style={'width': '40%',
              'margin-left': '30%',
              # 'background-color': '#2EBECD'
              }),
    html.Div([
    dcc.Graph(id='by_year_state',
              config={'displayModeBar': True})

        ],style={'margin-left':'23%','margin-top':'1%'})


  ])
@app.callback(Output('by_year_state', 'figure'),
              [Input('states_usa', 'value')])
def annual_by_country_barchart(states_usa):


    return {
        'data': [go.Bar(x=df[df['jurisdiction'] == c]['year'],
                        y=df[df['jurisdiction'] == c]['prisoner_count'],

                        textposition='auto',

                        name=c)
                        for c in states_usa],


         'layout': go.Layout(
             title='List of States: ' + ', '.join(states_usa),

            # plot_bgcolor='#323259',
            # paper_bgcolor='#323259',

            font={'family': 'Palatino'},
            width=1050,
            height = 520,
             barmode='group',
             template='plotly_white',
             yaxis=dict(
                 title='Prisoner in USA States',
                 titlefont_size=18,
                 tickfont_size=14,
             ),
             xaxis=dict(
                 title='Years',
                 titlefont_size=18,
                 tickfont_size=14,
             ),

         )

    }



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

Here you go, @jawabutt,
Multi=False means that the value of dropdown is not a list anymore, it’s a string that represents a US state. So you can’t use […for c in states_usa]. This code works:

return {
    'data': [go.Bar(x=df[df['jurisdiction'] == states_usa]['year'],
                    y=df[df['jurisdiction'] == states_usa]['prisoner_count'],

                    textposition='auto',

                    name=states_usa)],


     'layout': go.Layout(...
1 Like
5

Thank you so much Mr. adam schroeder . My problem was solved and I marked solution.