Python - Lowess regression integration for Plotly Dash

Question

I am attempting to create an interactive graph inside of the Dash framework. I am new to this type of setup and as a result I am starting off simple by recreating the "More About Visualizations" scatter plot found in the getting started guide with the slight addition of also adding a lowess regression. The desired outcome is that the sample graph remains identical with the fitted regression added. The code I have is:

import dash
import dash_core_components as dcc
import dash_html_components as html
import plotly.graph_objs as go
import pandas as pd
import statsmodels.api as sm

app = dash.Dash()

df = pd.read_csv(
    'https://gist.githubusercontent.com/chriddyp/' +
    '5d1ea79569ed194d432e56108a04d188/raw/' +
    'a9f9e8076b837d541398e999dcbac2b2826a81f8/'+
    'gdp-life-exp-2007.csv')

performance_line = pd.DataFrame(sm.nonparametric.lowess(df['life expectancy'], df['gdp per capita'], frac=0.75))

app.layout = html.Div([
    dcc.Graph(
        id='life-exp-vs-gdp',
        figure={
            'data': [
                go.Scatter(
                        x = performance_line[0],
                        y = performance_line[1],
                        mode = 'lines',
                        line = dict(
                            width=0.5
                                ), 
                        name = 'Fit'
                        ),
                go.Scatter(
                    x=df[df['continent'] == i]['gdp per capita'],
                    y=df[df['continent'] == i]['life expectancy'],
                    text=df[df['continent'] == i]['country'],
                    mode='markers',
                    opacity=0.7,
                    marker={
                        'size': 15,
                        'line': {'width': 0.5, 'color': 'white'}
                    },
                    name=i
                ) for i in df.continent.unique()
            ],
            'layout': go.Layout(
                xaxis={'type': 'log', 'title': 'GDP Per Capita'},
                yaxis={'title': 'Life Expectancy'},
                margin={'l': 40, 'b': 40, 't': 10, 'r': 10},
                legend={'x': 0, 'y': 1},
                hovermode='closest'
            )
        }
    )
])

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

This code will not work because of the for loop after the scatter plot. I have tried encompassing it in () and [], but the JSON subroutine cannot handle generators and the [] stops the breaking but does not actually plot the scatter plot. How can i get this graph with the additional lowess regression?

Answer 1

It seems to me like a syntax problem, list comprehensions have the following format (forgive the simplicity):

[(something with i) for i in (iterable)]

while what you're trying looks like

[(unrelated item), (something with i) for i in (iterable)]

The following slight modification should work:

[(unrelated item)]+[(something with i) for i in (iterable)]

so the final code will be something like this.

import dash
import dash_core_components as dcc
import dash_html_components as html
import plotly.graph_objs as go
import pandas as pd
import statsmodels.api as sm

app = dash.Dash()

df = pd.read_csv(
    'https://gist.githubusercontent.com/chriddyp/' +
    '5d1ea79569ed194d432e56108a04d188/raw/' +
    'a9f9e8076b837d541398e999dcbac2b2826a81f8/'+
    'gdp-life-exp-2007.csv')

performance_line = pd.DataFrame(sm.nonparametric.lowess(df['life expectancy'], df['gdp per capita'], frac=0.75))

app.layout = html.Div([
    dcc.Graph(
        id='life-exp-vs-gdp',
        figure={
            'data': [
                go.Scatter(
                    x = performance_line[0],
                    y = performance_line[1],
                    mode = 'lines',
                    line = dict(
                        width=0.5
                            ), 
                    name = 'Fit'
                )
            ]+[
                go.Scatter(
                    x=df[df['continent'] == i]['gdp per capita'],
                    y=df[df['continent'] == i]['life expectancy'],
                    text=df[df['continent'] == i]['country'],
                    mode='markers',
                    opacity=0.7,
                    marker={
                        'size': 15,
                        'line': {'width': 0.5, 'color': 'white'}
                    },
                    name=i
                ) for i in df.continent.unique()
            ],
            'layout': go.Layout(
                xaxis={'type': 'log', 'title': 'GDP Per Capita'},
                yaxis={'title': 'Life Expectancy'},
                margin={'l': 40, 'b': 40, 't': 10, 'r': 10},
                legend={'x': 0, 'y': 1},
                hovermode='closest'
            )
        }
    )
])

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