Black Lives Matter. Please consider donating to Black Girls Code today.

Map updated by dropdown - First callback working but not second one - close to give up :(

Hi,

Just starting with Dash and loving it… until I tried to have a filter to update a map (MapBox). The first callback generating the map works well, map is displayed. When I select on filter, the callback seems to run (I get the updated print(len(dff)), but the Map doesn’t get updated. On the other side my table is updated correctly by the filter

Did my research and suspect a version issue but I tried to downgrade and it didn’t change ( https://github.com/plotly/dash/issues/223 )

I’m dying for help here!!! :wink:

Flo

Here is my code and versions:

1) Requirements

dash==1.10.0
dash-core-components==1.9.0
dash-html-components==1.0.3
dash-renderer==1.3.0
dash-table==4.6.2
dash-table-experiments==0.6.0

2) Map Function

def gen_map(df):
    return {
        "data": [{
                "type": "scattermapbox",
                "lat": list(df['Latitude']),
                "lon": list(df['Longitude']),
                "hoverinfo": "text",
                "hovertext": [["Name: {} <br>Type: {} <br>Provider: {}".format(i,j,k)]
                                for i,j,k in zip(df['Nom'], df['Livraison'],df['Commune'])],
                "mode": "markers",
                "name": list(df['Nom']),
                "marker": {
                    "size": 6,
                    "opacity": 0.7
                }
        }],
        "layout": layout_map
    }

3) Map Layout:

layout_map = dict(
    autosize=True,
    height=500,
    font=dict(color="#191A1A"),
    titlefont=dict(color="#191A1A", size='14'),
    margin=dict(
        l=35,
        r=35,
        b=35,
        t=45
    ),
    hovermode="closest",
    plot_bgcolor='#fffcfc',
    paper_bgcolor='#fffcfc',
    legend=dict(font=dict(size=10), orientation='h'),
    #title='WiFi Hotspots in NYC',
    mapbox=dict(
        accesstoken=MAPBOX_API_TOKEN,
        #style="light",
        center=dict(
            lat=df['Latitude'].mean(),
            lon=df['Longitude'].mean()
        ),
        zoom=10,
    )
)

4) Dash Component

html.Div(
        [
            dcc.Graph(id='map-graph',
                      animate=True,
                      style={'margin-top': '20'})
        ] #, className="six columns"
    ),

5) Map Callback

def map_selection(city , delivery):
    if type(city) is list and city and type(delivery) and delivery:
        dff = df[(df['Commune'].isin(city)) & (df['Livraison'].isin(delivery))]
    elif type(city) is list and city:
        dff = dff = df[(df['Commune'].isin(city))]
    elif type(delivery) is list and delivery:
        dff = dff = df[(df['Livraison'].isin(delivery))]
    else:
        dff = df
    print(len(dff))
    print('generate map')
    return gen_map(dff)

Hi @flohaha regarding possible version conflicts, you can try to uninstall all the above packages and install only dash again, which will install compatible versions of all other packages (dcc, html, dash-table etc.) Incompatible versions of dash and dcc have been a frequent source of empty plots like yours in the past so let’s keep fingers crossed that this is the issue.