从过滤后的数据表到Dashbox的Dash回调

Question

我是Dash的新手，所以我想玩一个构建可以在不同城市显示啤酒厂的应用程序。我能够使DataTable正常运行（过滤器以应有的方式工作），但是当我过滤表中的数据时，映射的回调没有更新。谁能看到我哪里出问题了？

我尝试了不同的地图回调输入，但似乎没有任何改变。

# Layout
layout_map = dict(
    autosize=True,
    height=600,
    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='Breweries',
    mapbox=dict(
        accesstoken=mapbox_access_token,
        style="light",
        center=dict(
            lon=-97.91251,
            lat=37.7342
    ),
    zoom=3,
))

#Map function
def gen_map(MapDataFrame):
    return {
        "data": [{
            "type": "scattermapbox",
            "lat": list(MapDataFrame['Latitude']),
            "lon": list(MapDataFrame['Longitude']),
            "hoverinfo": "text",
            "hovertext": [["Company: {} <br>City: {} <br>State: {}".format(i,j,k)]
                            for i,j,k in zip(MapDataFrame['Company'], MapDataFrame['City'],MapDataFrame['State'])],
            "mode": "markers",
            "name": list(MapDataFrame['Company']),
            "color": list(MapDataFrame['Group']),
            "marker": {
                "size": 6,
                "opacity": 0.7
            }
    }],
    "layout": layout_map
}
# Dash App
app.layout = html.Div(
    html.Div([
        html.Div(
            [
                html.H1(children='Brewery Data',
                    className='nine columns'),
                style={
                    'height': '16%',
                    'width': '16%',
                    'float': 'right',
                    'position': 'relative',
                    'padding-top': 12,
                    'padding-right': 0
                },
            ),

        ], className="row"
    ),

# Map + table
    html.Div(
        [
            html.Div(
                [
                    dcc.Graph(id='map-graph',
                    animate = True
                    )
                ],
                className = "six columns"
            ),
            html.Div(
                [
                    dt.DataTable(
                        data=MapNewBreweries.to_dict('records'),
                        columns=[{"name": i, "id": i, "deletable":True, 'selectable':True} for i in MapNewBreweries.columns],
                        editable=True,
                        filter_action="native",
                        sort_action="native",
                        sort_mode="multi",
                        row_selectable="multi",
                        row_deletable=True,
                        hidden_columns=['Latitude', 'Longitude'],
                        page_action="native",
                        page_current= 0,
                        page_size= 15,
                        id='datatable'),
                ],
                style= layout_table,
                className="six columns"
            ),

    ], className="row"
    )
]))




#Callback to update Map
@app.callback(
 Output('map-graph', 'figure'),
 [Input('datatable', 'derived_virtual_selected_rows'),
 Input('datatable', 'data')])
def map_selection(derived_virtual_selected_rows, rows):
    aux = pd.DataFrame(rows)
    temp_df = aux.ix[derived_virtual_selected_rows, :]
    if len(derived_virtual_selected_rows) == 0:
        return gen_map(aux)
    return gen_map(temp_df)

# Main
if __name__ == "__main__":
    app.run_server(debug=True)

我试图在过滤器中输入丹佛，数据表和地图都将更新为仅丹佛的啤酒厂。我还没有看到任何错误，所以我认为表格和地图彼此之间并没有交谈。任何建议将不胜感激。