Object of type 'Response' is not JSON serializable

Dash Python
1

I get the above error when I try to perform a callback on a header.

My idea is: I want to make almost the entire Dashboard dependent on a dropdown menu that the user selects from to start.

Therefore, I need headers that are flexible… but I cannot seem to do this.

Code:

################## APP LAYOUT ##################
app.layout = html.Div(

    #style={'backgroundColor': colors['background']},
    children=[

        html.H1('Dashboard for Visualisation',
            style={
            'textAlign': 'center',
            'color': colors['text_black']
            }),

       # html.H3('Choose Analysis',
       #         style={
        #            'textAlign': 'center',
         #           'color': colors['text_black']
          #      }),

        html.Div([
            dcc.Dropdown(
                id='main_dropdown',
                options=[
                    {'label':'PCA', 'value':'PCA'},
                    {'label':'t-SNE', 'value':'t-SNE'}
                    ]

                )],

            style={'width': '28%',
                   'display': 'inline-block',
                   'textAlign': 'center'}
            ),


        html.Div(id='action_header'),

        html.Div(id='action'),

        html.Div(id='sub_action'),

        html.Div(id='output_graph'),

        dcc.Slider(
            id='slider',
            min=0,
            max=55,
            step=None,
            value=20,
            marks={
                5:'5',
                10:'10',
                15:'15',
                20:'20',
                25:'25',
                30:'30',
                35:'35',
                40:'40',
                45:'45',
                50:'50'
            },
            updatemode='drag'
            )

        #html.Div(id='slider_div')


    ])


################## CALLBACKS ##################
@app.callback(
    Output(component_id='action_header', component_property='children'),
    [Input(component_id='main_dropdown', component_property='value')])


@app.callback(
    Output(component_id='action', component_property='children'),
    [Input(component_id='main_dropdown', component_property='value')])



@app.callback(
    Output(component_id='sub_action', component_property='children'),
    [Input(component_id='main_dropdown', component_property='value')])


@app.callback(
    Output(component_id='output_graph', component_property='children'),
    [Input(component_id='slider', component_property='value')])


#@app.callback(
 #   Output(component_id='slider_div', component_property='children'),
  #  [Input(component_id='main_dropdown', component_property='value')])



################## FUNCTIONS ##################
def update_action_header(input):
    if(input == 't-SNE'):
        return html.H3("Pick labels to identify clusters",
            id='action_header')



def update_action_options(input):
    if(input == 't-SNE'):
        return dcc.Dropdown(id='gene-Dropdown',
                 options=[{'label': s, 'value': s}
                          for s in temp.keys()],
                 value=['IDH1','SomeGene1','SomeGene2'],
                 multi=True
                 )


def update_sub_action_options(input):
    if (input == 't-SNE'):
        return [
            html.Label('Dimensions in plot'),
            dcc.RadioItems(
                options=[
                    {'label': '2D', 'value': '2'},
                    {'label': '3D', 'value': '3'},
                ],
                value='2'
            )
        ]




# Make function that handles input and produces output
def update_graph(input):                           # Pull det correct dataframe

    # Return graph
    return dcc.Graph(
        id='tsne_perplexity_plot',
        figure={
            'data': [
                go.Scatter(
                    {'x':   dict['perp' + str(input)]['x'],
                    'y':    dict['perp' + str(input)]['y'],
                    'mode': 'markers',
                    'opacity': 0.7,
                               'marker' : {
                                          'size': 15,
                                          'line': {'width': 0.5, 'color': 'white'}
                                      }
                    }
                )
            ],
            'layout': {
                    'title': "Perplexity: " + str(input),
                   # 'plot_bgcolor': colors['background'],
                    #'paper_bgcolor': colors['background'],
                    'font': {
                    'color': colors['text']
                    },
            }
        }
    )



def update_slider(input):
    if(input == 't-SNE'):
        return dcc.Slider(
            id='slider',
            min=0,
            max=55,
            step=None,
            value=20,
            marks={
                5:'5',
                10:'10',
                15:'15',
                20:'20',
                25:'25',
                30:'30',
                35:'35',
                40:'40',
                45:'45',
                50:'50'
            },
            updatemode='drag'
            )
2 Likes