How to generate multiple SVG plots dependent on incoming JSON

Question

My end goal is to create something like this:

• The Timeseries shows total sales per department over time
• The slider (red) selects a month of interest that drives the radar plots
• The radar plot(generated for each Job Role) show the data for the specific month, broken out to show sales per department per Job Role (over time)

My timeseries chart is working correctly (loading from a csv file).

However, I am now stumped at how to:

1. Dynamically generate as many SVGs as are required from the incoming JSON array.

The javascript/D3 code I have is based on Alan Dunning's Radar Chart and Mike Bostocks Multi-Series Line Chart.

This is the structure of my master DataFrame that I have to work with:

colIndex=pd.MultiIndex.from_product([['New York','Paris'],
                                     ['Electronics','Household'],
                                     ['A','B','C'],
                                     ['Junior','Senior']],
                                    names=['City','Department','Team','Job Role'])

rowIndex=pd.date_range('25-12-2017',periods=12,freq='D')

df1=pd.DataFrame(np.random.randn(12, 24), index=rowIndex, columns=colIndex)
df1.index.name='Date'

Update: My Django view for loading the timeseries plot (from CSV):

def visual(request, storeCode):
    s = get_object_or_404(Store, store_code=storeCode)

    # ...other code to build lists: store, Department, Team, Role, SalesData ...
    arrays=[store, Department, Team, Role]                                               #Make a list of lists for the sales components
    tuples= list(zip(*arrays))                                                                     #Zip the list-of-lists into a tuple for each sales Series
    sales=pd.concat(salesData, axis=1)                                                             #Concatenate the Series' into a dataframe
    index=pd.MultiIndex.from_tuples(tuples, names=['Store','Category','Task','Role'])              #Give a name to each level of the columnar Multi-Index
    sales.columns=index                                                                            #Apply the names to the columnar Multi-Index
    sales.index.name='date'
    sales = sales.apply(pd.to_numeric)                                                             #Convert all Series' to floats

#Save master file to pickle (where it gets picked up by radar plot view)
with open(s.store_code + '.pickle', 'wb') as f:
    pickle.dump(sales, f, protocol=pickle.HIGHEST_PROTOCOL)

    salesByMonth=sales.sum(axis=1, level=[1]).resample('M').sum()                                  #Get totals for column index[0]
    salesByMonth.index.name="date"
    salesByMonth.to_csv('myApp/static/myApp/salesMONTH.csv', date_format='%Y%m%d')

    uniqueRoles=set(Role)

    return render(request, 'myApp/visual.html', {
        'store': s,
        'roles': ",".join(uniqueRoles),
    })

Update: My Django view for the radar plot(s) (from JSON):

def API_roles_month(request, storeCode):
    salesRolesByDay=pd.read_pickle(storeCode+'.pickle')
    data2=salesRolessByDay.resample('M').sum().stack([1,3]).reorder_levels([2,0,1]).sum(axis=1).sort_index()
    data2.name='Sales'
    data3=data2.reset_index()
    data4=data3.to_json(orient='records')

    return JsonResponse(data4, safe=False)