Hola tengo un problema con ChartJS, es el siguiente estoy tratando de hacer un gráfica dinámica muy sencilla, que trae datos desde la base de datos, ya traigo correctamente los datos de la base de datos y se visualizan de la siguiente manera.
El primer dato en consola es la data sin procesar traida de la base de datos lo que hice fue hacer una variabla array y hacer un push de los valores a ella para que me quedara como ChartJS lo pide, una vez tuve la variable la puse en data:
y no carga los datos, adjunto mi codigo js y del servidor.
$(document).ready(function() {
var inspection_id = $('#inspection_id').val();
var data = [];
var buenas = null;
var malas = null;
var piezas = [];
axios.get(`http://localhost/sorteo/public/revisions/getpieces/${inspection_id}`).then(response => {
data = response.data;
console.log(data);
buenas = data.piezas_buenas;
malas = data.piezas_malas;
piezas.push(buenas, malas);
console.log(piezas);
}).catch(response => {
console.log(response);
})
var ctx = document.getElementById('badAndGoodpieces');
var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: ['Piezas mal', 'Piezas bien'],
datasets: [{
label: 'Numero de piezas',
data: piezas
}]
}
});
});
Este es el resultado en la vista. Como ven no se imprimen los datos.
Aqui esta mi controlador de la base de datos por si lo requieren.
public function getPieces($id){
$revisions = Revision::where('inspection_id', $id)->get();
$piezas_buenas = 0;
$piezas_malas = 0;
foreach ($revisions as $revision) {
$piezas_buenas += $revision->good_pieces;
$piezas_malas += $revision->bad_pieces;
}
$data = [
'piezas_malas' => $piezas_malas,
'piezas_buenas' => $piezas_buenas
];
return response()->json($data, 200);
}
Chart
dentro de la funcionget