I can not use the donut and pie style with chartjs!

Navigation
0

So guys I'm using chartjs on a system here, but the pie and donut style does not display on the system. I imported the CDN's: 

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.0/Chart.bundle.js"></script><scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.0/Chart.js"></script>

And I made a graph.js file to put the chatjs codes and import it into my head: 

<code>var ctx = document.getElementById("ChartDonut");
var myDoughnutChart = new Chart(ctx, {
    type: 'doughnut',
    data: {
        labels: ["Pagos","Pendentes"],
        datasets: [{     
            data: [200, 137],
            backgroundColor: [
                'rgba(255, 99, 132, 0.2)',
                'rgba(54, 162, 235, 0.2)'   
            ]
        }]
    },
    options: {
        scales: {
            yAxes: [{
                ticks: {
                    beginAtZero:true
                }
            }]
        }
    }
});</code>

In my html I call the CANVAS normally: 

<canvas id="chartDonut"></canvas>

But neither DOUGHNUT nor PIE works. Does anyone know what?

    
asked by anonymous 28.09.2017 / 15:20

1 answer

0

You have two problems with your code.

The first is that the id % of% canvas is chartDonut in your script you are using ChartDonut .

The second are your options . See the list of what you can use. for this chart type.

See below the example of your patched code: 

var ctx = document.getElementById("chartDonut");
var myDoughnutChart = new Chart(ctx, {
  type: 'doughnut',
  data: {
    labels: ["Pagos", "Pendentes"],
    datasets: [{
      data: [200, 137],
      backgroundColor: [
        'rgba(255, 99, 132, 0.2)',
        'rgba(54, 162, 235, 0.2)'
      ]
    }]
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.0/Chart.bundle.min.js"></script><scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.0/Chart.min.js"></script>
<canvas id="chartDonut"></canvas>

Reading Tips:

28.09.2017 / 16:20
Doubt Installation of Laravel and PHP 7.0 WampServer Paper size limit using printer_draw_text php