Chartjs-My chart is not shown on browser screen using chart.js in meteor

by

0👍

✅

When you console log ‘$(“#myChart”).get(0)’ this will return you undefined, because on rendered your get(0) is not initialized, For prevent this you have to add a callback when you initialized you chart. So your get(0) will be initialized first then you can create your chats.

‘$(“#myChart”).get(0)’ is not a reative thing so your view will be not re-initialized.

Here is the working code:

function drawChart() {
    var oldCount = 2;
    var newCount = 4;
    var data = [{
        value: newCount,
        color: "#e53935",
        highlight: "#c62828",
        label: "New"
    }, {
        value: oldCount,
        color: "#3949ab",
        highlight: "#1a237e",
        label: "Regular"
    }];

    var pieOptions = {
        animation: false,
    }
    // Added a callback here.
    setTimeout( function(){
        if ($("#myChart").get(0)) {
            var ctx = $("#myChart").get(0).getContext("2d");
            var myNewChart = new Chart(ctx);
            console.log(myNewChart);
            new Chart(ctx).Pie(data, pieOptions);
        }   
    })
}

Leave a comment