CakePhp3 - Zeige Werte auf ChartJs

Question

Ich bin ein wenig neu zu CakePhP3 und ich versuche, einige Berichte in ChartJs zu generieren.

Ich habe eine Tabelle namens "Einkommen".

CREATE TABLE `incomes` (
`id` bigint(100) NOT NULL AUTO_INCREMENT, 
`title` varchar(500) NOT NULL, 
`description` varchar(5000) NOT NULL, 
`branch_id` bigint(100) NOT NULL, 
`amount` double NOT NULL, 
`created` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE 
CURRENT_TIMESTAMP, 
`comments` varchar(50000) DEFAULT NULL, 
`status` tinyint(1) NOT NULL, 
PRIMARY KEY (`id`) 
) ENGINE=InnoDB AUTO_INCREMENT=3 DEFAULT CHARSET=latin1; 

und ich möchte auf dem Chart monatlich erzeugte Gesamteinkommen Menge Wert. ZB - Januar 10.000, März 20.000.

// Get context with jQuery - using jQuery's .get() method. 
var areaChartCanvas = $("#areaChart").get(0).getContext("2d"); 
// This will get the first returned node in the jQuery collection. 
var areaChart = new Chart(areaChartCanvas); 

var areaChartData = { 
    labels: ["January", "February", "March", "April", "May", "June", "July","August", "September", "October", "November", "December"], 
    datasets: [ 
    { 
     label: "Electronics", 
     fillColor: "rgba(210, 214, 222, 1)", 
     strokeColor: "rgba(210, 214, 222, 1)", 
     pointColor: "rgba(210, 214, 222, 1)", 
     pointStrokeColor: "#c1c7d1", 
     pointHighlightFill: "#fff", 
     pointHighlightStroke: "rgba(220,220,220,1)", 
     data: [65, 59, 80, 81, 56, 55, 40] 
    } 
    ] 
}; 

Wie kann ich die Incomes Modell PagesController Sie laden und sie auf der Karte zeigen? Sende ich die Werte als JSON oder wie ist die Prozedur?

Answer 1

Sie können tun, wie diese

Kontroller

 $this->loadModel('Incomes'); 
     $incomes = $this->Incomes->find('list', [ 
      'keyField' => 'month', 
      'valueField' => 'amount', 
      'fields'=>[ 
       'month' => 'MONTHNAME(created)', 
       'amount' => 'SUM(amount)' 
      ], 
      'group' => ['month'], 
      'order'=>['MONTH(created)'=>'ASC'], 
     ])->toArray(); 

     $months = json_encode(array_keys($incomes)); 
     $amounts = json_encode(array_values($incomes)); 
     $this->set('months', $months); 
     $this->set('amounts', $amounts); 

Im Hinblick

// Get context with jQuery - using jQuery's .get() method. 
var areaChartCanvas = $("#areaChart").get(0).getContext("2d"); 
// This will get the first returned node in the jQuery collection. 
var areaChart = new Chart(areaChartCanvas); 

var areaChartData = { 
    labels: <?= $months; ?>, 
    datasets: [ 
    { 
     label: "Electronics", 
     fillColor: "rgba(210, 214, 222, 1)", 
     strokeColor: "rgba(210, 214, 222, 1)", 
     pointColor: "rgba(210, 214, 222, 1)", 
     pointStrokeColor: "#c1c7d1", 
     pointHighlightFill: "#fff", 
     pointHighlightStroke: "rgba(220,220,220,1)", 
     data: <?= $amounts; ?> 
    } 
    ] 
};