Wednesday, 5 May 2021

Labels attribute of chartsjs not taking context variable of type string

I have a chartsJS chart in my django site. I am using context variables to pass values from my main.py file to the showdata.html via views.py in order to populate the graph. the process goes like this:

  • Main.py

     myList = [T1_sum, T2_sum, T3_sum, T4_sum, T5_sum, T6_sum, T7_sum, T8_sum, T9_sum, T10_sum] 
     mylables = ["T1", "T2", "T3", "T4", "T5", "T6", "T7", "T8", "T9", "T10"]
     sortedlist, sortedlables = zip(*sorted(zip(myList, mylables), reverse=True))
     sortedlist = list(sortedlist)
     sortedlables = list(sortedlables)
    

views.py

def showdata(request):
import json
numbers_in_sModel = sModel.objects.all()
numbers_in_sortedList = MyModel.objects.all()
labels_in_sortedList = myModelSortedLabels.objects.all()

if request.session.get('stats',False):
    js_object = json.loads(request.session.get('stats'))


return render(request, "showdata.html", context={
'numbers_in_sModel':numbers_in_sModel,
'numbers_in_sortedList':numbers_in_sortedList,
'labels_in_sortedList':labels_in_sortedList
})

Showdata.html

var myChart = new Chart(ctx, {
                    type: 'horizontalBar',
                    data: {
                        labels: [
                                        
                        ],
                        datasets: [{
                            axis: 'y',
                            label: false,
                            data: [
                                    
                            ],
                            backgroundColor: ['#36CAAB', '#36CAAB', '#36CAAB', '#36CAAB', '#36CAAB','#36CAAB', '#36CAAB', '#36CAAB', '#36CAAB', '#36CAAB'],
                            borderWidth: 1
                        }]
                    },

Okay above code works to populate the chartsjs graph using the context variables. what is produced is a graph with see below in the picture. The labels of this graph are numbers. as seen in the picture. However what i am trying to do is to replace labels with the sorted labels list. Now the following code works to present the data on the showdata.html page if I put it in tags like etc. so i know the context variables are being passed. however when I place the following code in the labels section of chartsjs it does not present the label values in the graph.


The funny thing is the when i inspection page i see the values in the labels section that should be there except there is an error on the very first label entry saying:

Uncaught ReferenceError: T9 is not defined

enter image description here



from Labels attribute of chartsjs not taking context variable of type string

No comments:

Post a Comment