Chartjs-Unable to Draw Chart using ChartJS

by

0👍

✅

You have a syntax error here: 

    {
        label : "Write Speed in Mbps",

should be (add comma):

    ,{
        label : "Write Speed in Mbps",

Please check your console output and maybe use vscode or atom to edit your JavaScript code as the editor would have told you about the syntax error as well.

Make sure you use a recent version of chart.js (2.7.0 bundled up or with dependencies).

I cannot reproduce the error with fixed data so it is either a syntax error in your code, wrong json sent by php or wrong version of chart.js

var testid = [1,2,3,4,5];
var readspeed = [6,7,8,9,10];
var writespeed = [4,5,6,7,8];

var chartdata = {
    labels : testid,
    datasets : [
        {
            label : "Read Speed in Gbps",
            data : readspeed,
            backgroundColor : "blue",
            borderColor : "lightblue",
            fill : false,
            lineTension : 0,
            pointRadius : 5
        }

        ,{
            label : "Write Speed in Mbps",
            data : writespeed,
            backgroundColor : "blue",
            borderColor : "darkblue",
            fill : false,
            lineTension : 0,
            pointRadius : 5
        }
    ]
};

var options = {
    title : {
        display : true,
        position : "top",
        text : "New Test Results",
        fontSize : 18,
        fontColor : "#111"
    },
    legend : {
        display : true,
        position : "bottom"
    }
};

if (chart) {
    chart.destroy();
}
var ctx = $('#mycanvas');
var chart = new Chart( ctx, {
    type : "line",
    data : chartdata,
    options : options
});
    <canvas id="mycanvas" width="400" height="400"></canvas>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.0/Chart.bundle.js"></script>

Leave a comment