为什么chart.js不在Bootstrap块中显示结果

lyr7nygr  于 2023-01-20  发布在  Chart.js
关注(0)|答案(1)|浏览(179)

html没有显示条形图,而条形图应该是https://www.chartjs.org/docs/latest/getting-started/中的条形图
输入chart.html

{% extends "base.html" %}

{% block js %}
    <div>
      <canvas id="myChart"></canvas>
    </div>
    <script src="../static/js/try.js"></script>
{% endblock %}

单位:try.js

import 'https://cdn.jsdelivr.net/npm/chart.js';
const ctx = document.getElementById('myChart');

  new Chart(ctx, {
    type: 'bar',
    data: {
      labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
      datasets: [{
        label: '# of Votes',
        data: [12, 19, 3, 5, 2, 3],
        borderWidth: 1
      }]
    },
    options: {
      scales: {
        y: {
          beginAtZero: true
        }
      }
    }
  });
vecaoik1

vecaoik11#

importtry.js中出现故障。
解决方案是在chart.html中重新定位import
chart.html中:

{% extends "base.html" %}

{% block js %}
    <div>
      <canvas id="myChart"></canvas>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
    <script src="../static/js/try.js"></script>
{% endblock %}

我试过了,奏效了。

相关问题