ChartJs php array into 'labels' and 'datasets'

user_8159891 0
Viewed 2097

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?

yii2 chart.js php
2 Answers

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
        ],
    ] 
]
]); ?>
user_52759590

My error was in another part of code, related to the arrays. I will post the right solution:

<?= 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,
            ],
        ] 
    ]
]); ?>

This is the PHP to get current week data:

$labels = array();
$data = array();

$curweek = date('Y-m-d', strtotime("previous monday"));
$today = date('Y-m-d');

$dates = new DatePeriod(
    DateTime::createFromFormat('Y-m-d|', $curweek),
    new DateInterval('P1D'),
    DateTime::createFromFormat('Y-m-d|', $today)->add(new DateInterval('P1D'))
);

foreach ($dates as $date) {
    $datestr = $date->format('Y-m-d');
    $index = array_search($datestr, array_column($chartvalue, 'dataNl'));
    if ($index === false) {
        $labels[] = date("d", strtotime($datestr));
        $data[] = 0;
    } else {
        $labels[] = date("d", strtotime($datestr));
        $data[] = $chartvalue[$index]['totale'];
    }
}
user_81598910
Related