Question

我正在尝试在我的视图（Codeigniter）上显示一个简单的图表，但它没有出现。有人能告诉我我错过了什么吗？感谢你的帮助。

<div class="container">
  <h2>This is a sample — Line Chart</h2>
  <div>
      <canvas id="myChart"></canvas>
  </div>
 </div>

 <script type="text/javascript" src="http://www.chartjs.org/assets/Chart.js">
var ctx = document.getElementById("myChart").getContext("2d");

var myChart = new Chart(ctx, {
    type: 'line',
    data: {
        labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
        datasets: [{
            label: '# of Votes',
            data: [12, 19, 3, 5, 2, 3]
        }]
    },
    options: {
        scales: {
            yAxes: [{
                ticks: {
                    beginAtZero:true
                }
            }]
        }
    }
});
</script>

Answer 1

我解决了我的问题。我只是更改了脚本标记上的源代码。请参阅下面的更新代码。

is
am

Answer 2

您缺少js代码的脚本标记

<script>
var ctx = document.getElementById("myChart").getContext("2d");

var myChart = new Chart(ctx, {
    type: 'line',
    data: {
        labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
        datasets: [{
            label: '# of Votes',
            data: [12, 19, 3, 5, 2, 3]
        }]
    },
    options: {
        scales: {
            yAxes: [{
                ticks: {
                    beginAtZero:true
                }
            }]
        }
    }
});
</script>

在codeigniter中使用chart.js添加图表

2 个答案: