Codeigniter Donut chartjs отображает пустые с данными MySQL запроса ⇐ Php

[Anonymous]

Я пытаюсь реализовать пончик chartjs с помощью набора данных MySQL. Код не имеет никакой ошибки, но диаграмма не отображается на холсте. Легенды данных также не отображаются. Любая поддержка по этому вопросу будет оценена.

Код: Выделить всё

public function getChart3() {
//current month vehicle make count pie chart query
$query = $this->db->query( "SELECT ci_vehicle_make.vehicle_make AS 'vehicleMake', count(ci_vehicle_make.vehicle_make) AS 'totalCount'
FROM ci_parking
JOIN ci_vehicle ON ci_parking.vehicle_id=ci_vehicle.vehicle_id
JOIN ci_vehicle_make ON ci_vehicle.vehicle_make_id=ci_vehicle_make.vehicle_make_id
JOIN ci_vehicle_type ON ci_vehicle.vehicle_type_id=ci_vehicle_type.vehicle_type_id
WHERE MONTH(ci_parking.parking_entry) = MONTH(CURRENT_DATE())
AND YEAR(ci_parking.parking_entry) = YEAR(CURRENT_DATE())
AND ci_parking.is_deleted = 0
GROUP BY ci_vehicle_make.vehicle_make" );
$res = $query->result();
return $res;
}

контроллер
Извлечение контроллера для проекта отображается ниже:

Код: Выделить всё

public function getChart3() {

$data = $this->dashboard->getChart3();
echo( json_encode( $data ) );

}

public function index() {

$data[ 'chart3' ] = $this->dashboard->getChart3();

$this->load->view( 'admin/dashboard/index', $data );

}

js code
код JavaScript для проекта отображается ниже:

Код: Выделить всё

  var pieChartCanvas = $('#pieChart').get(0).getContext('2d')
var pieChart = new Chart(pieChartCanvas)

$.ajax({
url:"",
method:"GET",
data:{action:'fetch'},
dataType:"JSON",
success:function(data) {

var vehicle_Make = [];
var total_Count = [];
var piecolor = [];
var len = data.length;

for (var i = 0; i < len; i++) {
var randomColor = Math.floor(Math.random()*16777215).toString(16);
vehicle_Make.push(data[i]['vehicleMake']);
total_Count.push(data[i]['totalCount']);
randomColor = "#" + randomColor;
piecolor.push(randomColor);
}

//output data
console.log(vehicle_Make);
console.log(total_Count);
console.log(piecolor);

var PieData = {
labels: vehicle_Make,
datasets:[
{
data     : total_Count,
color    : piecolor,
highlight: piecolor,
label    : 'Vehicle Make',
}
]
}

var pieOptions     = {
//Boolean - Whether we should show a stroke on each segment
segmentShowStroke    : true,
//String - The colour of each segment stroke
segmentStrokeColor   : '#fff',
//Number - The width of each segment stroke
segmentStrokeWidth   : 2,
//Number - The percentage of the chart that we cut out of the middle
percentageInnerCutout: 50, // This is 0 for Pie charts
//Number - Amount of animation steps
animationSteps       : 100,
//String - Animation easing effect
animationEasing      : 'easeOutBounce',
//Boolean - Whether we animate the rotation of the Doughnut
animateRotate        : true,
//Boolean - Whether we animate scaling the Doughnut from the centre
animateScale         : false,
//Boolean - whether to make the chart responsive to window resizing
responsive           : true,
// Boolean - whether to maintain the starting aspect ratio or not when responsive, if set to false, will take up entire container
maintainAspectRatio  : true,
//String - A legend template
legendTemplate       : '[list]-legend">[/list]'
}
//Create pie or douhnut chart
// You can switch between pie and douhnut using the method below.
//pieChart.Pie(PieData, pieOptions)
pieChart.Doughnut(PieData, pieOptions)
}
});

output

, если я изменяю последнюю строку кода в js на:
, если я изменю последнюю строку кода в:
, если я изменяю последнюю строку кода в:
, если я изменю последнюю строку кода в:
, если я изменю последнюю строку кода в:
, если я изменю последнюю строку кода в:
, если я изменю последнюю строку кода в js:

Код: Выделить всё

pieChart.Bar(PieData, pieOptions)

Диаграмма отображается без случайных цветов:


Подробнее здесь: https://stackoverflow.com/questions/766 ... query-data