Home forums Chart Support Display Y and Y2 on the same label

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
  • #16006


    I am trying to display 2 values per label, y and y2, obtained from data.php:


       $sql="SELECT hour, success, failed FROM daily_chart";
        $data_points = array();
        $result = mysqli_query($conn, "$sql");
        while($row = mysqli_fetch_array($result))
            $point = array("label" => $row['hour'] , "y" => $row['success'], "y2" => $row['failed']);
            array_push($data_points, $point);        
        echo json_encode($data_points, JSON_NUMERIC_CHECK);

    JSON result:

    I use the array above as input to getJSON, but nothing is displayed with the code below:

    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript" src="canvasjs.js"></script>
    <script type="text/javascript">
     $(document).ready(function () {
    	var dataPointsSuccess = [];
    	var dataPointsFailed = [];
    // Ajax request for getting JSON data
    	$.getJSON("data.php", function(result) {
    		for( var i = 0; i < result.length; i++) {
    			dataPointsSuccess.push({ label: result[i].label, y: result[i].y });
    			dataPointsFailed.push({ label: result[i].label, y: result[i].y2 });
    // Chart with label + y and y2 values or multiSeries Chart
    		var chart = new CanvasJS.Chart("multiChart",
    				text: "Chart with y and y2 values"
    			data: [
    				type: "column",
    				dataPoints: dataPointsSuccess
    				type: "column",
    				dataPoints: dataPointsFailed
    <div id="multiChart" style="width: 80%; height: 300px;></div>
    • This topic was modified 3 years, 5 months ago by Gigi.


    Are you looking for something like this?

    Indranil Deo,
    Team CanvasJS


    Hello Indranil,

    I need something like this:
    2 values per X

    For each hour of the day I will have 2 values.
    I tried the code from Anjali for the 3rd graph: https://canvasjs.com/forums/topic/multiple-charts-from-one-json-result/
    But it does not work for me. Please help.

    PS: Sorry for registering twice, the password recovery doesn’t send a valid link to reset the password.

    Best regards,

    • This reply was modified 3 years, 5 months ago by Gigi1.


    Please take a look at this new example.

    Thanks for reporting the password reset issue. We are looking into it. Meanwhile, please use this link to reset your password.

    Indranil Deo,
    Team CanvasJS


    Hello Indranil,

    The example provided is almost ok, except that it enters the data manually.
    This is why the code provided by Anjali is much closer to my need, but it doesn’t work, maybe there is a syntax error.
    I need to split automatically the data_points into dataPoints1 and dataPoints2.

    Thank you for your help! I really appreciate it!




    Please take a look at this example. It creates the chart using JSON Data from an external source.

    Indranil Deo,
    Team CanvasJS


    Hi Indranil,

    Thank you very much, this is exactly what I needed!
    It works very well, the only modification I made is below, in order to display the label received from JSON.

    return label = e.chart.data[0].dataPoints[i].label;

    Thank you very much for your time and dedication, I really appreciate it!

    Best regards,



    Glad you figured it out.

    Indranil Deo,
    Team CanvasJS

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.