Data Table Interactivity With Graph

Hi,

I am trying to create a data table that interactively generates a graph depending on how you edit the rows/columns. My code is very similar to the sample seen in the documentation. While my code to create the table works and shows the table in my dashboard, the resulting graph does not show up. The error I get is a key error: ‘map’ which I know has to do with a dictionary issue, but I keep looking at the code for my graph and do not see any issues. I am wondering if this possibly has to something to do with the dash table that I somehow missed? My code is below:

app.layout=html.Div(children=[
html.H1('Sentiment Analysis', style={'textAlign': 'center',    'fontSize': 36}),

html.Div([html.Img(src='data:image/png;base64,{}'.format(encoded_image2.decode()))], style={'textAlign': 'center'}),

html.Div([
dash_table.DataTable(id='datatable-interactivity',
columns=[{'id': i, 'name': i, "deletable": True} for i in df.columns],
data=df.to_dict('rows'),
editable=True,
filtering=True,
sorting=True,
sorting_type="multi",
row_selectable="multi",
row_deletable=True,
selected_rows=[],
pagination_mode="fe",
    pagination_settings={
    "displayed_pages":1,
    "current_page":0,
    "page_size": 35,},
    navigation="page",
style_table={
    'maxHeight': '300',
    'overflowY': 'scroll',
    'border': 'thin lightgrey solid'},
style_cell={'minWidth': '100px', 'width': '100px', 'maxWidth': '200px',
    'whiteSpace': 'normal'}
)]),
html.Div(id='datatable-interactivity-container')])

@app.callback(
Output('datatable-interactivity-container', "figure"),
[Input('datatable-interactivity', "derived_virtual_data"),
 Input('datatable-interactivity', "derived_virtual_selected_rows")])

def update_graph(rows, derived_virtual_selected_rows):
if derived_virtual_selected_rows is None:
    derived_virtual_selected_rows = []

if rows is None:
    dff = df
else:
    dff = pd.DataFrame(rows)

colors = []
for i in range(len(dff)):
    if i in derived_virtual_selected_rows:
        colors.append("rgb(0,191,255)")
    else:
        colors.append("rgb(255,215,0)")

return html.Div([dcc.Graph(
            id=i,
            figure={
                "data":{"x":dff["Tweet"],
                         "y":dff[column] if column in dff else [],
                         "type":"scatter",
                         "marker":{"color":colors},
                         "text":dff["Text"]
                   },
                "layout":{
                    "xaxis":{"automargin": True},
                    "yaxis":{"automargin": True},
                    "height":250,
                },
            },
        )
for column in ["Positive", "Negative", "Compound"]])

if __name__=='__main__': app.run_server(debug=True)

I feel like the issue would be in the update graph function but the only mapping dictionary issue that could be there (from what I see) would be the color scheme. However, I believe the rgb tagging would address that issue. Let me know if you have any ideas as it would be greatly appreciated, thanks!