Highcharts and ajax

0

I'm trying to create a graphic with highcharts from some data that I get with ajax by json .

This is my .js :

function graficoData (data) {
   $('#chart1').highcharts({
chart: {
    type: 'column'
},
title: {
    text: 'Equipos por estados'
},
xAxis: {
    categories: ['Activo', 'Reserva', 'En Reparación', 'Baja']
},
yAxis: {
    title: {
        text: 'Número de equipos'
    }
},
series: data,
  });
}
$(document).ready(function() {
$.ajax({
url: '/grafico-estados/',
type: 'GET',
async: true,
dataType: "json",
success: function (data) {
    graficoData(data);
}
  });
 });

The data that I get is:

[{"estado":"Activo","total":2},{"estado":"Baja","total":1},{"estado":"Reserva","total":1}]

How can I do it?

Thank you.

    
asked by Sergio Ramirez Dominguez 25.06.2017 в 20:03
source

2 answers

0

Greetings

Take a look at the format of Series in it you will notice the format (say); instead of "status" use x and instead of "total": 2 use data: [2] (and, of course, for each one, respectively, it seems to me that at the moment the graphic will be shown, and the presentation is a matter of how the work should actually be shown.

Success.

    
answered by 25.06.2017 в 20:31
0

I have solved it in the following way:

function graficoData (data) {
   $('#chart1').highcharts({
   chart: {
       type: 'column'
   },
   title: {
       text: 'Equipos por estados'
   },
   xAxis: {
       categories: [data[0].estado, data[1].estado, data[2].estado]
   },
   yAxis: {
       title: {
            text: 'Número de equipos'
       }
   },
   series: [{
        name: 'Total',
        data: [data[0].total, data[1].total, data[2].total],
    }, ]
  });
}

But now I find another problem. I have 4 possible columns to show, but there are times when one of the states is usually 0.

How can I always show it even if it's 0?

My SQL query in my Model is:

public static function Grafico(){
    return DB::table('equipos')
        ->select('estados.estado', DB::raw('count(*) as total'))
        ->join('estados','estados.id', '=', 'equipos.id_estado')
        ->groupBy('estados.estado')
        ->get();
    }
    
answered by 25.06.2017 в 23:50