У меня проблема с производительностью на диаграмме, загруженной с помощью Chartjs на веб-странице
Это столбчатая диаграмма с накоплением, и я выполняю много вычислений для данных, извлеченных из моей базы данных.
То, что я хочу знать, это где мне нужно изменить свой код, чтобы улучшить время выполнения?
Благодаря stackoverflow, я добавил это для вычисления времени выполнения:
$time_start = microtime(true);
echo 'Total execution time in seconds: ' . (microtime(true) - $time_start);
вокруг моих двух основных циклов в моем php-файле.
Результат здесь:
Total execution time in seconds: 0.01149320602417
Total execution time2 in seconds: 0.0041401386260986
Так что, очевидно, это не из-за циклов, верно?
Я также отслеживал производительность с Chrome:

А также:

Означает ли это, что медленная загрузка происходит из-за Chartjs или ничего не доказывает?
Изначально я думал, что из-за этого поста: Слишком медленный рендеринг Chart.js на графике вертикальных столбчатых столбцов , что это был способ присвоить значения графику в цикле, но теперь ябольше не уверен.
Мой способ передать переменные на мой график (вычислен второй цикл):
for ($cd=0; $cd <= $curday; $cd++) {
for ($i=0; $i <$maxy; $i++) {
if (!isset($dataset[$i][$cd])) break;
//$dummydata = array(NULL, $dataset[$i][$cd]);
$dummydata = array();
// add empty values for previous days
for ($zz=0; $zz < $cd; $zz++){
$dummydata[]=null;
}
// add current value
$dummydata[]=$dataset[$i][$cd];
$dummy=array('type' => "bar",
'label' => "Intensity " . $intensity[$i][$cd],
'backgroundColor' => $intColors[$intensity[$i][$cd]],
'data' => ($dummydata));
array_push($arrDatasets, $dummy);
}
}
РЕДАКТИРОВАТЬ: данные в json:
$arrReturn = (array('labels' => $labels,
'datasets' => $arrDatasets));
$mydata = json_encode(($arrReturn));
РЕДАКТИРОВАТЬ: Часть Javascript:
$html .= "<script>";
$html .= "var ctx=document.getElementById('myChart').getContext('2d');";
$html .= "var myChart = new Chart(ctx, {";
$html .= "type:'". $type . "',";
$html .= "data:" . $mydata . ",";
$html .= "options: " . $options;
$html .= "});";
$html .= "</script>";
Это вывод $ mydata: 