невозможно экспортировать переменную из admin.py в переопределенный шаблон в django

Question

спокойной ночи, я переопределил шаблон в django (change_list. html), чтобы показать диаграмму. js диаграммы на django странице администратора после учебника в этого учебника , bute когда я добираюсь до части, когда нужно заменить жестко запрограммированные данные на переменную chart_data из файла admin.py и вставить ее в переопределенный шаблон change_list. html, ничего не происходит, и таблица показывает все значения в 1. что могло случиться, я не нашел никакой информации о том, как переменные передаются из admin.py в переопределенные файлы шаблона html. Вот код

class ReporteActividadUsuariosAdmin(admin.ModelAdmin):
list_display = ['nombre','apellidos','carnet','cliente','cantidad_de_prestamos']    
ordering = ['-cantidad_de_prestamos']


def changelist_view(self, request, extra_context=None):
    chart_data = (
                   ReporteActividadUsuarios.objects.annotate(Count("cantidad_de_prestamos"))
                  .values("nombre","apellidos")
                  .annotate(y=Count("cantidad_de_prestamos"))
                  #.group_by("cantidad_de_prestamos")
                  #.order_by("-carnet")
                 )

    # Serialize and attach the chart data to the template context
    as_json = json.dumps(list(chart_data), cls=DjangoJSONEncoder)
    extra_context = extra_context or {"chart_data": as_json}
    # Call the superclass changelist_view to render the page
    return super().changelist_view(request, extra_context=extra_context)

def has_add_permission(self, request):
    return False

и переопределенный файл шаблона change_list. html выглядит следующим образом:

    {% extends "admin/change_list.html" %}
{% load static %}
{% block content %}

{% block extrahead %}
{{ block.super }}

<link rel="stylesheet" href="{% static '/asset/css/Chart.min.css' %}" />
<script src="{% static '/asset/js/admin/Chart.bundle.min.js' %}"></script>

<script>
document.addEventListener('DOMContentLoaded', () => {
  const ctx = document.getElementById('myChart').getContext('2d');

  const chartData = {{ chart_data | safe }};
  //const chartData = [1,7,12,8,2] ;
   // Render the chart
  var myPieChart = new Chart(ctx, {
    type: 'bar',
    data: {
       datasets: [{
         data: chartData,
         borderColor: '#00443436' ,
         backgroundColor: ['#df0000','lightgreen','orange','lightblue','lightyellow'],

    }],

    // These labels appear in the legend and in the tooltips when hovering different arcs
    labels: [
        'MARIA DEL CARMEN   MUZIO ZARRANZ',
        '   LAY MI  RODRIGUEZ GUILBEAUX',
        'REINALDO LAZARO    LASTRE LABRADA',
        'SISSI CARIDAD  RODRIGUEZ PERAZA',
        'AUSTIN LLERANDI PEREZ'
     ]
    },
    options: {

      //animation: { animateRotate: true,} ,


      }
   });

}) ;
</script>
{% endblock %}

<h3> Usuarios Mas Activos </h3>
<div style="width: 23%;">
<canvas style="margin-bottom: 0px; width: 65%; height: 60%;"
id="myChart"></canvas>
</div>

<!-- Render the rest of the ChangeList view by calling block.super -->
{{ block.super }}
{% endblock %}

большое спасибо заранее,