こんにちは。Cakephpを最近勉強し始めたものなのですが、
今回はajaxとcakephpとの連携で引っかかってしまったので
質問させていただきます。
今回実現させたいことは、Datasというデータベースからのデータをajaxをつかってリアルタイムで更新しながらChart.jsを使ったグラフで表示させるというものです。
データベースはresult（値は１つ）,created(投票された時間)の二つです。
このresultはAとBがあり、これをパーセンテージ化して表示したいと思っています。
また、リアルタイムというのは毎秒1秒で更新したいと思っています。
一応書いたコードがこちらになります。

/js/ajax.js
$(function() {
    $.ajax({
        url: "result",
        type: "get",
        dataType: "html"
    }).done(function (response) {
        //dataからAとBのパーセントを割り出してa_lastに代入するコードが入ります
        var chartColors = {
          red: 'rgb(255, 99, 132)',
        };


        function onRefresh(chart) {
          chart.config.data.datasets.forEach(function(dataset) {
            dataset.data.push({
              x: a_last,
              y: Date.now()
            });
          });
        }

        var color = Chart.helpers.color;
        var config = {
          type: 'line',
          data: {
            datasets: [{
              label: '結果',
              backgroundColor: color(chartColors.red).alpha(0.5).rgbString(),
              borderColor: chartColors.red,
              fill:false
            }]
          },
          options: {
            title: {
              display: true,
              text: '結果'
            },
            scales: {
              xAxes: [{
                type: 'linear',
                display: true,
                scaleLabel: {
                  display: true,
                  labelString: '%'
                }
              }],
              yAxes: [{
                type: 'realtime',
                realtime: {
                  duration: 10000,
                  refresh: 1000,
                  delay: 2000,
                  onRefresh: onRefresh
                },
              }]
            },
            tooltips: {
              mode: 'nearest',
              intersect: false,
              callbacks: {
                title: function(tooltipItems) {
                  return tooltipItems[0].yLabel;
                },
                label: function(tooltipItem, data) {
                  var label = data.datasets[tooltipItem.datasetIndex].label;
                  if (label) {
                    label += ': ';
                  }
                  label += tooltipItem.xLabel;
                  return label;
                }
              }
            },
            hover: {
              mode: 'nearest',
              intersect: false
            }
          }
        };

        window.onload = function() {
          var ctx = document.getElementById('myChart').getContext('2d');
          window.myChart = new Chart(ctx, config);
        };
    }).fail(function () {
        alert("failed");
    });
});

こちらはctpファイルです。

<script type="text/javascript">
var data = [];
var updata = function(){
<?php foreach ($datas as $data): ?>
    var A = "A"
    var B = "B"
    var result = <?= h($data->result) ?>;
    if (result!=0){
       data.push(result);
    }
<?php endforeach; ?>
setTimeout(updata, 10000);
} 
updata();
</script>
<?php echo $this->Html->script('ajax.js');?>
<canvas id="myChart"></canvas>

こちらがcontrollerです。

public function result()
{
    $datas = $this->paginate($this->Datas);
    $this->set(compact('datas'));
}

こんな感じにしたいです。

今の段階としては、グラフは動きますが、50パーセントであったらずっと５０パーセントのままという感じです。