✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
🐇 Announcing Dash VTK for 3d simulation graphics. Check out the March webinar.

Invalid value on color of px.scatter

I’ve have something weird going on here… Sometimes my code works perfectly fine but sometimes I get an invalid value error on the color of the plotly figures. One time on the ‘continent’ and the other time on the ‘country’ and one time it just workst perfectly. As I delete the second figure I think the error dissapears. Someone who can help me?

import dash_html_components as html
import dash_core_components as dcc
import dash_bootstrap_components as dbc
from dash.dependencies import Input, Output, State, ALL, MATCH
import pandas as pd
import plotly.express as px
import plotly.graph_objects as go

from Hotspot_App_Local import app
from Cards import Cards

df = pd.read_csv(‘merged_layers.csv’)
scatterlst = dcc.Dropdown(id=‘scatterglobal’, options= [{‘label’: col, ‘value’: col} for col in sorted(df.columns)], multi=True)
card1 = Cards(‘Global Analysis’, [scatterlst], Header= True)

scatterlst2 = dcc.Dropdown(id=‘scattercont’, options= [{‘label’: col, ‘value’: col} for col in sorted(df.columns)], multi=True)
continents = sorted(df[‘continent’].unique())
continent_drop = dcc.Dropdown(id=‘contlst’, options= [{‘label’: cont, ‘value’: cont} for cont in continents], value= continents[0])
excl_country = dcc.Dropdown(id=‘excl_country’, multi= True)
card2 = Cards(‘Select Layers’, [scatterlst2], Header= True)
card3 = Cards(‘Select Continent’, [continent_drop], Header= True)
card4 = Cards(‘Exclude Countries’, [excl_country], Header= True)

layout = html.Div([
dbc.Card(card1, color=“light”, outline=True),
html.Div(id= ‘globalplotdiv’),
dbc.CardHeader(‘Continental Analysis’),
html.Br(),
dbc.Row([dbc.Col(dbc.Card(card2, color=“light”, outline=True)),
dbc.Col(dbc.Card(card3, color=“light”, outline=True)),
dbc.Col(dbc.Card(card4, color=“light”, outline=True))
]),
html.Div(id= ‘contplotdiv’)
])

@app.callback(
Output(‘scatterglobal’, ‘value’),
[Input(“selected_columns”, “data”)]
)
def set_multiselect(data):
return data

@app.callback(
Output(‘globalplotdiv’, ‘children’),
[Input(“scatterglobal”, “value”)]
)
def global_scatterplot(columns):
df = pd.read_csv(‘merged_layers.csv’)
if len(columns) > 2:
fig = px.scatter_matrix(df,
dimensions= columns,
color= df[“continent”])
fig.update_traces(diagonal_visible=False, showupperhalf=False)
return dcc.Graph(id=‘world_scatter’, figure=fig)

if len(columns) == 2:
    fig = px.scatter(df,
        x= columns[0],
        y= columns[1],
        color= df['continent']
    )
    return dcc.Graph(id='world_scatter', figure=fig)

else:
    return dcc.ConfirmDialog(id='global_warning', message="Select at least Two Layers", )

@app.callback(
Output(‘global_warning’, ‘displayed’),
[Input(“scatterglobal”, “value”)]
)
def warning(columns):
if len(columns) <= 1:
return True
return False

@app.callback(
Output(‘scattercont’, ‘value’),
[Input(‘scatterglobal’, ‘value’)]
)
def set_multiselect2(data):
return data

@app.callback(
Output(‘excl_country’, ‘options’),
[Input(‘contlst’, ‘value’)]
)
def excl_country(cont):
df = pd.read_csv(‘merged_layers.csv’)
df = df[df[‘continent’] == cont]
return [{‘label’: c, ‘value’: c} for c in sorted(df[‘country’].unique())]

@app.callback(
Output(‘contplotdiv’, ‘children’),
[Input(“scattercont”, “value”),
Input(“contlst”, “value”),
Input(‘excl_country’, ‘value’)]
)
def cont_scatterplot(columns, cont, ex_country):
df2 = pd.read_csv(‘merged_layers.csv’)
df2 = df2[df2[‘continent’] == cont]
if ex_country is not None:
mask = df2[‘country’].isin(ex_country)
df2 = df[~mask]
if len(columns) > 2:
fig = px.scatter_matrix(df2,
dimensions= columns,
color= df2[“country”])

    fig.update_traces(diagonal_visible=False, showupperhalf=False)
    return dcc.Graph(id='cont_scatter', figure=fig)

if len(columns) == 2:
    fig = px.scatter(df2,
        x= columns[0],
        y= columns[1],
        color= df2['country']
    )
    return dcc.Graph(id= 'cont_scatter', figure=fig)
else:
    return dcc.ConfirmDialog(id='cont_warning', message="Select at least Two Layers", )

@app.callback(
Output(‘cont_warning’, ‘displayed’),
[Input(“contlst”, “value”)]
)
def warning(columns):
if len(columns) <= 1:
return True
return False