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

@flohaha wrote:

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!!!

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)

Posts: 2

Participants: 2

Read full topic