Python list在django中不支持ChartJS

jchrr9hc  于 2023-10-18  发布在  Chart.js
关注(0)|答案(2)|浏览(153)

我正在创建一个Web应用程序,我需要创建一些图表。我使用Django 3和ChartJS。我已经为标签创建了一个列表,为要插入到ChartJS中的数据创建了一个列表。我遇到的问题是,无论我尝试或做什么,数据都不会显示在图表中。当我试图通过在页面上写入数据来访问数据时,它确实工作,但由于某种原因,当将其插入ChartJS时,它根本不工作。
根据ChartJS文档,数据字段可以接收值列表,所以我不明白为什么这不起作用。
我用google和stackoverflow搜索了很多解决方案,虽然我在stackoverflow上找到了一些类似的线程,但这些解决方案对我不起作用。我尝试转换为json,其他插入数据的方法,使用for循环等,但无论我做什么,似乎都不起作用。
在Web应用程序中,标签和值是动态创建的,但为了更容易地解决问题,我手动创建了两个列表,并试图将它们发送到模板并将其插入ChartJS中,这也不起作用。
这是我目前使用的代码:

views.py:

  1. def check_spending(request):
  2. graph_labels = ["Test1", "Test2", "Test3"]
  3. graph_values = ["100", "50", "20"]
  4. return render(request, 'spending/view_spending.html',
  5. {'graph_labels': graph_labels,
  6. 'graph_values': graph_values})

HTML:

  1. <!-- Values are printed out here -->
  2. {{ graph_labels }}
  3. {{ graph_values }}
  4. for loop
  5. {% for key in graph_labels %}
  6. {{ key }}
  7. {% endfor %}
  8. <!-- Values does not work here -->
  9. <canvas id="spending_overview_detailed" width="400" height="400"></canvas>
  10. <script>
  11. var ctx = document.getElementById('spending_overview_detailed');
  12. var spending_overview_detailed = new Chart(ctx, {
  13. type: 'bar',
  14. data: {
  15. labels: [{{ graph_labels }}],
  16. datasets: [{
  17. label: 'Spending',
  18. data: [{{ graph_values }}],
  19. borderWidth: 1
  20. }],
  21. },
  22. options: {
  23. scales: {
  24. y: {
  25. beginAtZero: true
  26. }
  27. }
  28. }
  29. });
  30. </script>
daolsyd0

daolsyd01#

我最终将标签和数据字段更改为以下内容:

  1. [{% for label in graph_labels %} {{ label }}, {% endfor %}]
  2. [{% for value in graph_values %} {{ value }}, {% endfor %}]

注意for循环中的逗号,如果没有它,值将无法正确处理。

8ulbf1ek

8ulbf1ek2#

{{ graph_labels }}和{{ graph_values }}是Django模板变量,你试图在JavaScript中访问它们,这将不起作用。使用模板标签“json_script”Django文档将数据从django模板传递到您的JavaScript。

相关问题