Dash Web-app doesn't work. Error: POST /_dash-update-component HTTP/1.1" 500 -

Question

I am just starting to learn a Python web-app library "Dash", that's why I could possibly ask sily questions.

Basically my following code will create a dashboard by using a python library "Dash". If everything works fine, I could select from a dropdown one out of 3 stock tickers (Apple, Tesla, Coca Cola). After selecting it, the stock price dated back to 01.01.2016 until now will be shown.

My code is:

from pandas_datareader import data
import plotly.graph_objects as go

import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output
from datetime import datetime as dt

app = dash.Dash(__name__)

app.layout = html.Div([
    html.H3('Stock Tickers'),
    
    dcc.Dropdown(
        id='my-dropdown',
        options=[
            {'label': 'Coke', 'value': 'COKE'},
            {'label': 'Tesla', 'value': 'TSLA'},
            {'label': 'Apple', 'value': 'AAPL'}
            ],
        value='COKE'
    ),
    
    dcc.Graph(id='my-graph', figure={})
])

@app.callback(
    [Output(component_id='my-graph', component_property='figure')],
    [Input(component_id='my-dropdown', component_property='value')])
def update_graph(dropdown_properties):
    selected_value = dropdown_properties['value']
    
    df = data.DataReader(selected_value, 'yahoo', dt(2016, 1, 1), dt.now())
    print(df[:5])
    
    figure = go.Figure(data=[go.Scatter(x=df.index, y=df.Close, 
                                     name=selected_value)])
    
    return {
        'figure': figure}

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

I got following error messages:

Dash is running on http://127.0.0.1:8050/
    
     * Serving Flask app "Stock_Ticker" (lazy loading)
     * Environment: production
       WARNING: This is a development server. Do not use it in a production deployment.
       Use a production WSGI server instead.
     * Debug mode: off
     * Running on http://127.0.0.1:8050/ (Press CTRL+C to quit)
    127.0.0.1 - - [27/Mar/2021 13:20:10] "GET / HTTP/1.1" 200 -
    127.0.0.1 - - [27/Mar/2021 13:20:12] "GET /_dash-layout HTTP/1.1" 200 -
    127.0.0.1 - - [27/Mar/2021 13:20:12] "GET /_dash-dependencies HTTP/1.1" 200 -
    [2021-03-27 13:20:12,391] ERROR in app: Exception on /_dash-update-component [POST]
    Traceback (most recent call last):
      File "C:\Users\Gunardilin\anaconda3\lib\site-packages\flask\app.py", line 2447, in wsgi_app
        response = self.full_dispatch_request()
      File "C:\Users\Gunardilin\anaconda3\lib\site-packages\flask\app.py", line 1952, in full_dispatch_request
        rv = self.handle_user_exception(e)
      File "C:\Users\Gunardilin\anaconda3\lib\site-packages\flask\app.py", line 1821, in handle_user_exception
        reraise(exc_type, exc_value, tb)
      File "C:\Users\Gunardilin\anaconda3\lib\site-packages\flask\_compat.py", line 39, in reraise
        raise value
      File "C:\Users\Gunardilin\anaconda3\lib\site-packages\flask\app.py", line 1950, in full_dispatch_request
        rv = self.dispatch_request()
      File "C:\Users\Gunardilin\anaconda3\lib\site-packages\flask\app.py", line 1936, in dispatch_request
        return self.view_functions[rule.endpoint](**req.view_args)
      File "C:\Users\Gunardilin\anaconda3\lib\site-packages\dash\dash.py", line 1078, in dispatch
        response.set_data(func(*args, outputs_list=outputs_list))
      File "C:\Users\Gunardilin\anaconda3\lib\site-packages\dash\dash.py", line 1009, in add_context
        output_value = func(*args, **kwargs)  # %% callback invoked %%
      File "C:\Users\Gunardilin\Desktop\Value Investing Dashboard\Dash\Stock_Ticker.py", line 39, in update_graph
        selected_value = dropdown_properties['value']
    TypeError: string indices must be integers
    127.0.0.1 - - [27/Mar/2021 13:20:12] "POST /_dash-update-component HTTP/1.1" 500 -
    [2021-03-27 13:20:18,959] ERROR in app: Exception on /_dash-update-component [POST]
    Traceback (most recent call last):
      File "C:\Users\Gunardilin\anaconda3\lib\site-packages\flask\app.py", line 2447, in wsgi_app
        response = self.full_dispatch_request()
      File "C:\Users\Gunardilin\anaconda3\lib\site-packages\flask\app.py", line 1952, in full_dispatch_request
        rv = self.handle_user_exception(e)
      File "C:\Users\Gunardilin\anaconda3\lib\site-packages\flask\app.py", line 1821, in handle_user_exception
        reraise(exc_type, exc_value, tb)
      File "C:\Users\Gunardilin\anaconda3\lib\site-packages\flask\_compat.py", line 39, in reraise
        raise value
      File "C:\Users\Gunardilin\anaconda3\lib\site-packages\flask\app.py", line 1950, in full_dispatch_request
        rv = self.dispatch_request()
      File "C:\Users\Gunardilin\anaconda3\lib\site-packages\flask\app.py", line 1936, in dispatch_request
        return self.view_functions[rule.endpoint](**req.view_args)
      File "C:\Users\Gunardilin\anaconda3\lib\site-packages\dash\dash.py", line 1078, in dispatch
        response.set_data(func(*args, outputs_list=outputs_list))
      File "C:\Users\Gunardilin\anaconda3\lib\site-packages\dash\dash.py", line 1009, in add_context
        output_value = func(*args, **kwargs)  # %% callback invoked %%
      File "C:\Users\Gunardilin\Desktop\Value Investing Dashboard\Dash\Stock_Ticker.py", line 39, in update_graph
        selected_value = dropdown_properties['value']
    TypeError: string indices must be integers
    127.0.0.1 - - [27/Mar/2021 13:20:18] "POST /_dash-update-component HTTP/1.1" 500 -

From the link (http:...), I could only see a blank graph:

I would be very thankful, if someone can pinpoint what my mistake is.

Answer 1

The value from your dropdown comes through as one of the following:

'COKE'
'TSLA'
'AAPL'

but you're treating it as if it came through like this:

{'label': 'Coke', 'value': 'COKE'},
{'label': 'Tesla', 'value': 'TSLA'},
{'label': 'Apple', 'value': 'AAPL'}

Basically, you can just delete this line:

selected_value = dropdown_properties['value'] and your code should work.