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

Type Error String indices must be integers

Hi Friends,

I am new bee to python Dash. I need help regarding how to use Dash Core Components clickData to update the graph.

I have made a map and upon clicking its marker, it should display the graph of particular Network operator however whenever i click the graph, it displays that string indices must be integers for line (mccmnc = clickData[‘points’][0][‘customdata’])
import dash
import numpy as np
from scipy.stats import t
from numpy import average, std
from math import sqrt
import pandas as pd
from pandas import Series, DataFrame
import dash
from dash.dependencies import Input, Output, Event
import dash_core_components as dcc
import dash_html_components as html
import matplotlib.pyplot as plt
from matplotlib import rcParams
import seaborn as sb
import datetime as dt
import time
import glob
from datetime import timedelta
import dash_table_experiments as dtable
import plotly.plotly as py
import plotly.graph_objs as go
import os
import json
from textwrap import dedent as d
app=dash.Dash()

    styles = {
        'pre': {
            'border': 'thin lightgrey solid',
            'overflowX': 'scroll'
        }
    }

    def data_sort():
        Stats1='C:/Users/muzamal.pervez/Desktop/Python Scripts/Second Project/IBRoamers.csv'
        LOC1='C:/Users/muzamal.pervez/Desktop/Python Scripts/Second Project/mcc-mnc-table.csv'

        DF1=pd.read_csv(Stats1)
        Table=pd.read_csv(LOC1,encoding = "ISO-8859-1")

        DF2=DF1.groupby(['Start Time', 'MCC', 'MNC']).sum()
        DF2=DF2.reset_index()
        DF2.insert(loc=1, column='NE Name', value='NWD')
        DF=pd.concat([DF1,DF2])
        #DF['Start Time']=pd.to_datetime(DF['Start Time'])
        DF=DF.sort_values(by=['Start Time','MCC', 'MNC'], ascending=False)
        DF=DF.reset_index(drop=True)

        DF['2G_Attach_SR(%)']=(DF['Gb mode attach accept times per PLMN (times)']/DF['Gb mode attach request times per PLMN (times)'])*100
        DF['3G_Attach_SR(%)']=(DF['Iu mode attach accept times per PLMN (times)']/DF['Iu mode attach request times per PLMN (times)'])*100
        DF['LTE_Combined_Attach_SR(%)']=(DF['S1 Mode Combined Attach Success Times for EPS and non-EPS Services per PLMN (times)']/DF['S1 Mode Combined Attach Request Times per PLMN (times)'])*100
        DF['2G_PDP_SR(%)']=((DF['Gb mode MS init PDP context act request times per PLMN (times)']-DF['Gb mode MS init PDP context act fail times per PLMN (times)'])/DF['Gb mode MS init PDP context act request times per PLMN (times)'])*100
        DF['3G_PDP_SR(%)']=(DF['Iu mode MS init PDP context act success times per PLMN (times)']/DF['Iu mode MS init PDP context act request times per PLMN (times)'])*100
        DF['LTE_PDN_Connect_SR(%)']=(DF['S1 Mode PDN Connect Success Times per PLMN (times)']/DF['S1 Mode PDN Connect Request Times per PLMN (times)'])*100
        DF['2G_Att_Fail(times)']=DF['Gb mode attach request times per PLMN (times)']-DF['Gb mode attach accept times per PLMN (times)']
        DF['2G_PDP_Fail(times)']=DF['Gb mode MS init PDP context act fail times per PLMN (times)']
        DF['3G_Att_Fail(times)']=DF['Iu mode attach request times per PLMN (times)']-DF['Iu mode attach accept times per PLMN (times)']
        DF['3G_PDP_Fail(times)']=DF['Iu mode MS init PDP context act request times per PLMN (times)']-DF['Iu mode MS init PDP context act success times per PLMN (times)']
        DF['LTE_Att_Fail(times)']=DF['S1 Mode Combined Attach Request Times per PLMN (times)']-DF['S1 Mode Combined Attach Success Times for EPS and non-EPS Services per PLMN (times)']
        DF['LTE_PDP_Fail(times)']=DF['S1 Mode PDN Connect Request Times per PLMN (times)']-DF['S1 Mode PDN Connect Success Times per PLMN (times)']
        DF['Total_Att_Fail(times)']=DF['2G_Att_Fail(times)']+DF['3G_Att_Fail(times)']+DF['LTE_Att_Fail(times)']
        DF['Total_PDP_Fail(times)']=DF['2G_PDP_Fail(times)']+DF['3G_PDP_Fail(times)']+DF['LTE_PDP_Fail(times)']
        DF['Attached Users(2G,3G,LTE)']=DF['Iu mode attached Average user number per PLMN (number)']+DF['Gb mode attached Average user number per PLMN (number)']+DF['Gb mode attached Average user number per PLMN (number)']
        DF['MCCMNC']=(DF['MCC'].str[-3:]) + (DF['MNC'].str[-2:])
        Table['MCCMNC']=Table['MCCMNC'].astype(str)
        DF=DF.merge(Table, on='MCCMNC')
        DF['Start Time']=pd.to_datetime(DF['Start Time'])
        Latest=DF['Start Time'].max()
        DF.to_csv('DF.csv', index=False)
        DF3=DF[DF['Start Time']==Latest]
        DF3=DF3[DF3['NE Name']=='NWD']
        DF3=DF3.drop(DF3[DF3['Attached Users(2G,3G,LTE)']<50].index)
        DF3=DF3.drop(DF3[DF3['MCCMNC']=='41001'].index)
        DF3=DF3.drop(DF3[DF3['MCCMNC']=='41007'].index)
        DF3=DF3.reset_index(drop=True)
        DF3['Text']=DF3['MCCMNC'].astype(str)+' '+DF3['Country']+ ":"+DF3['Network']+ "Total IB roamers: "+DF3['Attached Users(2G,3G,LTE)'].astype(str)
        DF3.to_csv('DF3.csv', index=False)
        scale = 15

        data = dict(
                type = 'scattergeo',
                autosize=False, 
                width=2000,
                height=2000,
                locationmode = 'world',
                lon = DF3['Long1'],
                lat = DF3['Lat1'],
                text = DF3['Text'],
                customdata=DF3['MCCMNC'].astype(int),
                marker = dict(
                    size = DF3['Attached Users(2G,3G,LTE)']/scale,
                     color = np.where(((DF3['3G_Attach_SR(%)'] < 70)|(DF3['2G_Attach_SR(%)'] < 70)|(DF3['3G_PDP_SR(%)'] < 70)|(DF3['2G_PDP_SR(%)'] < 70))&((DF3['2G_Att_Fail(times)']>500)|(DF3['2G_PDP_Fail(times)']>500)|(DF3['3G_Att_Fail(times)']>500)|(DF3['3G_PDP_Fail(times)']>500)), 'red', 'green'),
                    line=dict(color='#7FFF00'),
                    sizemode = 'area'
                )
            ),
        layout = dict(
                title = 'Jazz IB Roamers from around the Globe',
                showlegend = False,
                geo = dict(
                    resolution=50,
                    scope='world',
                    projection=dict( type='world' ),
                    showcoastlines=True,
                    coastlinecolor="#F4A460",
                    coastlinewidth=0.2,
                    showland = True,
                    showframe=False,
                    showocean=True,
                    showcountries=True,
                    showcountrycodes=True,
                    showcontinents=True,
                    showrivers=True,
                    rivercolor="#F4A460",
                    riverwidth=0.2,
                    showlakes=True,
                    lakecolor="#F4A460",
                    lakewidth=0.2,
                    landcolor = '#262626',
                    oceancolor='#000033',
                    showsubunit=True,
                    subunitwidth=0.2,
                    countrywidth=0.5,
                    subunitcolor="#F4A460",
                    countrycolor="#F4A460"
                ),
            )


        fig = dict( data=data, layout=layout )
        return fig

    app.layout  = html.Div([
        dcc.Graph(id='Map1', figure=data_sort()),
          html.Div([
            dcc.Dropdown(
            id='my_dropdown',
            options=[
                {'label': 'NWD', 'value': 'NWD'},
                {'label': 'ISB', 'value': 'USN-ISB'},
                {'label': 'KHI', 'value': 'USN-KHI'},
                {'label': 'LHR', 'value': 'USN-LHR'}
            ],
            value='NWD')]),
        dcc.Interval(id='graph-update',interval=300000),
        dcc.Graph(id='graph1', animate=True,clickData={'points': [{'customdata': '42403'}]})
    ])

    @app.callback(
        dash.dependencies.Output('graph1','figure'),
        [dash.dependencies.Input('my_dropdown', 'value'),
        dash.dependencies.Input('Map1', 'clickData')],
        events=[dash.dependencies.Event('graph-update', 'interval')]
        )
    def Graph1(clickData, USN):
        data_sort()
        address2 = 'C:/Users/muzamal.pervez/Desktop/Python Scripts/DF.csv'
        DF6=pd.read_csv(address2)
        DF6=DF6.loc[DF6['NE Name'] == USN]
        mccmnc = clickData['points'][0]['customdata']
        DF6=DF6.loc[DF6['MCCMNC'] == mccmnc]
        return {
            'data': [{
                    'x': DF6['Start Time'],
                    'y': DF6['2G_Attach_SR(%)'],
                    'name':'{} ::2G Roaming Attach SR'.format(USN),
                        'line' : {
                            'color':'#00CD00'
                        }

                }, 
                {
                'x': DF6['Start Time'],
                'y': DF6['3G_Attach_SR(%)'],
                    'name':'{} ::3G Roaming Attach SR'.format(USN),
                     'line' : {
                            'color':'#4876FF'
                        }

                }
                ],
                'layout' : go.Layout(
                  title='Live Throughput Trend(Mbps)',
                  titlefont=dict(
                  size=36,
                  color='#212121'
                   ),
                  xaxis=dict(
                  title='Start Time',
                  titlefont=dict(
                  family='Courier New, monospace',
                  size=24,
                  color='#030303'
                )
            ),
                yaxis=dict(
                title='Throughput(Mbps)',
                titlefont=dict(
                family='Courier New, monospace',
                size=24,
                color='#030303'
            )
        )
                )
        }

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

May be i am missing something. Your guidance will really help me out here. Thanks a lot