ChartJs php array into 'labels' and 'datasets'

Question

I'm using using Yii2 with ChartJS library, i would ask if is possible to push array into labels and data range.

This is my code now:

<?= ChartJs::widget([
    'type' => 'line',
    'options' => [
        'height' => 400,
        'width' => 800,
    ],
    'data' => [
        'labels' => [$m[0], $m[1], $m[2], $m[3], $m[4], $m[5], $m[6], $m[7], $m[8], $m[9], $m[10], $m[11]],
        'datasets' => [
            [
                'label' => "2018",
                'backgroundColor' => "rgba(255,99,132,0.2)",
                'borderColor' => "rgba(255,99,132,1)",
                'pointBackgroundColor' => "rgba(255,99,132,1)",
                'pointBorderColor' => "#fff",
                'pointHoverBackgroundColor' => "#fff",
                'pointHoverBorderColor' => "rgba(255,99,132,1)",
                'data' => [$t[0], $t[1], $t[2], $t[3], $t[4], $t[5], $t[6], $t[7], $t[8], $t[9], $t[10], $t[11]]
            ],
        ] 
    ]
]); ?>

As you can see i'm setting value specifing the position in the array of each element.

I tried doing something like that:

$tot = "\"" . implode($t, ", \"") . "\"";

The above code make this result:

"0", "12", "5", "7", ...

But if i try to do something like that, it doesn't work:

'data' => [$tot] or 'data' => $tot

Is it possible?

Answer 1

I used to do it like this:

var ctx = document.getElementById("Chart1"); // the element where the chart should be rendered
var myChart1 = new Chart(ctx, {
     type: 'line',
     data: {
        labels: [<?php 
            foreach( $m as $key => $row) {
                   echo "'".$row['label']."', "; // you can also use $row if you don't use keys                  
            }
         } ?>],

         datasets: [{
            label: '2018',
            data: [<?php
            foreach( $t as $key => $row) {
               echo "'".$row['data']."', "; // you can also use $row if you don't use keys         
             } ?>],
            backgroundColor => "rgba(255,99,132,0.2)",
            borderColor => "rgba(255,99,132,1)",
            pointBackgroundColor => "rgba(255,99,132,1)",
            pointBorderColor => "#fff",
            pointHoverBackgroundColor => "#fff",
            pointHoverBorderColor => "rgba(255,99,132,1)",
          }]
       },
     options => [
        'height' => 400,
        'width' => 800,
     ]
});  

I create the chart with javascript and add data from inside my php array.

You can display the chart by adding a element with the above ID.

PHP is used to process data and JS to display data.
So use JS to display the chart and PHP to process data.

In your case you can just do this:

<?php
$data = array(foreach( $t as $key => $row) {
     echo "'".$row['data']."', "; // you can also use $row if you don't use keys         
});
$labels = array(foreach( $m as $key => $row) {
     echo "'".$row['label']."', "; // you can also use $row if you don't use keys         
});
?>

<?= ChartJs::widget([
'type' => 'line',
'options' => [
    'height' => 400,
    'width' => 800,
],
'data' => [
    'labels' => $labels,
    'datasets' => [
        [
            'label' => "2018",
            'backgroundColor' => "rgba(255,99,132,0.2)",
            'borderColor' => "rgba(255,99,132,1)",
            'pointBackgroundColor' => "rgba(255,99,132,1)",
            'pointBorderColor' => "#fff",
            'pointHoverBackgroundColor' => "#fff",
            'pointHoverBorderColor' => "rgba(255,99,132,1)",
            'data' => $data
        ],
    ] 
]
]); ?>