Я так наклонен, так так так наклонен. Некоторое время пытался работать с chart.js на своем веб-сайте, который я создал с помощью Django. Я хочу построить два поля: даты и результаты. Dates — это дата, например 06.01.2022, score — число с плавающей запятой. Моя проблема в том, что когда я передаю список python скрипту, он делает вид, что это что-то отвратительное. Но когда я копирую и вставляю список и помещаю его в данные диаграммы, все в порядке. Это не работает только тогда, когда он думает, что это переменная, которая просто не имеет никакого смысла, и я не могу найти нигде, где говорится об этом.

Views.py

def progress(response):

    lessons = StudentLessons.objects.get(name=response.user.email)

    scores = []
    dates = []
    for lesson in lessons.lesson_set.all():
        dates.append(str(lesson.date))
        scores.append(str((lesson.accuracy+lesson.speed+lesson.understanding)/3))

    context = {
        'dates':dates,
        'scores':scores,
    }


    return render(response, "main/progress.html", context)

Date = ['2022-09-27', '2022-09-28'] scores = ['4.3333333333333333', '6.0'] (из консоли) html, который отображает правильную диаграмму

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



<canvas id="myChart" style="width:100%;max-width:700px"></canvas>

<script type="text/javascript">

    var myChart = new Chart("myChart",{
        type:"line",
        data: {
            labels: ['2022-09-27', '2022-09-28'],
            datasets:[{
                borderColor: "rgba(0,0,0,0.1)",
                data: ['4.333333333333333', '6.0']
            }]
        },
        options:{
            responsive: true,
            legend: {
                position: 'top',
             },
        }
    });

</script>

Html, который не работает

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



<canvas id="myChart" style="width:100%;max-width:700px"></canvas>

<script type="text/javascript">

    var myChart = new Chart("myChart",{
        type:"line",
        data: {
            labels: dates,
            datasets:[{
                borderColor: "rgba(0,0,0,0.1)",
                data: scores
            }]
        },
        options:{
            responsive: true,
            legend: {
                position: 'top',
             },
        }
    });

</script>

Любая помощь будет искренне оценена, это сводит меня с ума, и это буквально последнее, что мне нужно делать.

0
Max Smith 27 Сен 2022 в 21:36

1 ответ

Вам нужно будет заключить ключи контекста в {{ и }} при ссылке в html. В html dates и scores необходимо обновить как {{dates}} и {{scores}}. Вы можете обратиться к документам для получения дополнительной информации.

0
Kailashnath Nagendran 27 Сен 2022 в 21:55