ChartJS:在Django的html中未显示

问题描述 投票:0回答:1

我将在html中绘制水平条形图,但未显示。我从views.py发送2变量是{{top5StockCode}}{{top5TotalSales}}。 views.py发送的{{top5StockCode}}的值为['23166','21108','85123A','48185','22470']{{top5TotalSales} }[[2671740,227322,171770,158120,143808]。这是我在html文件中的代码。

<div class="top5">
    <p class="topicTop5">Top 5 Selling Products</p>
    <canvas id="top5"></canvas>
</div>
<script>
    var top5 = document.getElementById('top5').getContext('2d');
    var chart = new Chart(top5, {
        type: 'horizontalBar',
        data: {
            labels: {{top5StockCode}},
            datasets: [{
                label: 'Top 5 selling products ',
                backgroundColor: '#CE3B21',
                borderColor: 'rgb(255, 99, 132)',
                data: {{top5TotalSales}}
            }]
        },
        options: {   
            legend: { 
                display: false
            },
            responsive: true,
            maintainAspectRatio: false,
            scales: {
                yAxes: [{
                    ticks: {
                         beginAtZero:true
                    }
                }]
            }
        }
    });
</script>

我很困惑,为什么它没有显示图形。请帮我。谢谢

python html django chart.js
1个回答
0
投票

<div class="top5">更改为<div id="top5">

更改

var top5 = document.getElementById('top5').getContext('2d');

to

var top5 = document.getElementsByClassName('top5')[0].getContext('2d');
© www.soinside.com 2019 - 2024. All rights reserved.