Как отобразить линейный график с помощью Charts.js и Django?

Я хотел бы отобразить линейный график в моем шаблоне Django с помощью chart.js, но я не могу отобразить ничего, кроме переменных labels и data. Структура данных кажется правильной согласно документации, что может вызвать проблему?

> labels
['Home']

> data
[{'x': '2022-01-07 16:00:00', 'y': 1.0}, {'x': '2022-01-08 16:00:00', 'y': 1.01}, {'x': '2022-01-08 17:00:00', 'y': 1.05}]

base_generic.html

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.4/Chart.js"> </script>

template.html

{% extends "base_generic.html" %}
{% load static %}
{% block content %}
{% block scripts %}

    <script>
    // jquery function
    $(document).ready(function(){
            var ctx = document.getElementById('myChart').getContext('2d');
            var myChart = new Chart(ctx, {
                type: 'line',
                data: {
                    labels: {{labels}},
                    datasets: [{
                        label: 'Home data',
                        data: {{data}}
                    }]
                }
    });
        });
    </script>
{% endblock scripts %}

<canvas id="myChart" width="400" height="100"></canvas>

{% endblock %}

Вернуться на верх