多线chart.js + Django图形无法正确呈现

时间:2020-04-18 21:43:22

标签: javascript python django

我花了整整一天的时间试图弄清楚该图未在html中呈现的情况。我在这里找不到我做错了什么。我发现的最接近的帖子是此Django and Chart.js Not Rendering Graph Correctly,那里提供的帮助无法解决问题。我的基本问题是我不确定如何在图表内部传递数据。

这是我的js脚本

function setChart(){
var ctx5 = document.getElementById('myChart5').getContext('2d');


                var myChart5 = new Chart(ctx5, {
                        type: 'line',
                        data: {
                            labels: ["days-15","days-14", "days-13","days-12","days-11","days-10","days-9","days-8","days-7","days-6","days-5","days-4","days-3","days-2","days-1"],
                            datasets: [{
                                label: 'Number of orders placed',
                                data: [

                                    {% for dr in tableau1 %}{{ dr.number_of_orders_placed}}, {% endfor %}],
                                backgroundColor: [
                                    'rgba(54, 162, 235, 0.2)',
                                ],
                                borderColor: [
                                    'rgba(54, 162, 235, 0.2)',
                                ],
                                borderWidth: 1

                            },
                                {
                             label: 'purchased_quantity',
                                data: [{% for dr in tableau1 %}{{ dr.purchased_quantity}},{% endfor %}],
                                backgroundColor: [
                                    'rgba(54, 162, 235, 0.2)',
                                ],
                                borderColor: [
                                    'rgba(54, 162, 235, 0.2)',
                                ],
                                borderWidth: 1
                                },
                                {
                                label: 'sold_quantity',
                                data: [{% for dr in tableau1 %}{{ dr.sold_quantity}},{% endfor %}],
                                backgroundColor: [
                                    'rgba(54, 162, 235, 0.2)',
                                ],
                                borderColor: [
                                    'rgba(54, 162, 235, 0.2)',
                                ],
                                borderWidth: 1

                                }
                            ],
                            options: {
                                scales: {
                                    yAxes: [{
                                        gridLines: {
                                            drawOnChartArea: false,
                                            }
                                    }],
                                }
                            }
                        }
                    })

}
}
)

和我的view.py

@method_decorator(login_required, name='dispatch')
class HomeView(View):
 def get(self, request, *args, **kwargs):
    tableau1 = tableau.objects.all()
        return render(request, 'dashboard/index.html', {'tableau1' : tableau1
                                                       })

model.py

class tableau(models.Model):
    id = models.IntegerField(default=0, primary_key=True)
    number_of_orders_placed = models.IntegerField(default=0)
    purchased_quantity = models.IntegerField(default=0)
    sold_quantity = models.IntegerField(default=0)

我得到了错误:

ProgrammingError at /Home
column dashboard_tableau.id does not exist
LINE 1: SELECT "dashboard_tableau"."id", "dashboard_tableau"."number...
               ^

很抱歉,如果这是一个初学者的问题,我是javascript的新手,我正在努力查找最新情况。任何帮助将不胜感激

0 个答案:

没有答案