Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Chart.js t.ticks.map is not a function

Both results and labels come from the server but they seem alright. When I run this code I don't get any graphics. I'm using the chart.js from the CDN.

EDIT: Clarification, both results and data come from the code. They are not hardcoded as they look in the example.

The errors I get say:

t.ticks.map is not a function

Unable to get property 'skip' of undefined or null reference

The code:

<canvas id="myChart" width="400" height="400"></canvas>
var ctx = document.getElementById("myChart").getContext("2d");
var result = [0, 0, 0];
var lbls = ['A', 'B', 'C'];
var myChart = new Chart(ctx, {
    type: 'line',
    data: {
        labels: lbls.split(','),
        datasets: [{
            label: '# of Votes',
            data: result
        }]
    }
});

Any suggestion about another chart utility is welcome too.

like image 706
ffuentes Avatar asked Feb 14 '17 05:02

ffuentes


1 Answers

The labels requires a array variable but the var lbls = $('#lbls').html() returns a string so splitting it with ',' will do the job

var myChart = new Chart(ctx, {
type: 'line',
data: {
    labels: lbls.split(','),
    datasets: [{
        label: '# of Votes',
        data:  [20, 10]
    }]
}
});
like image 177
Pratheeswaran Avatar answered Oct 13 '22 07:10

Pratheeswaran