how to display various data in a label of charts.js?

Question

how to display various data in a label of charts.js?

Navigation

#1 by (1 votes)
#2 by (0 votes)

1

in a label I want to put the dates that bring me what I received php ... the problem is that it only shows me a date and does not cover all the dates in label ..

CODE

$.ajax({
                type: 'POST',
                url: 'api/graficos_ventas.php',
                data: {'fechainicio' : fechinicio, 'fechafinal' : fechfinal},
                success: function(data){
                    var valores = JSON.parse(data);

                    var Datos = {
                                    labels : [for (var i = valores.length - 1; i >= 0; i--) 
                                                {
                                                    valores[i].fechfactura;
                                                },],
                                    datasets : [
                                        {
                                            fillColor : 'rgba(91,228,146,0.6)', //COLOR DE LAS BARRAS
                                            strokeColor : 'rgba(57,194,112,0.7)', //COLOR DEL BORDE DE LAS BARRAS
                                            highlightFill : 'rgba(73,206,180,0.6)', //COLOR "HOVER" DE LAS BARRAS
                                            highlightStroke : 'rgba(66,196,157,0.7)', //COLOR "HOVER" DEL BORDE DE LAS BARRAS
                                            data : [valores]
                                        }
                                    ]
                                }

                            var contexto = document.getElementById('grafico').getContext('2d');
                            window.Barra = new Chart(contexto).Bar(Datos, { responsive : true });
                        }
                    });
                    return false;
                }

I tried to do a for inside the label to show me all the dates but it did not work, I would appreciate the interest of how I can solve that detail.

javascript jquery php chart.js

asked by JDavid 20.02.2017 в 01:34

source

2 answers

use while or foreach for array management? limited and dependent selections between two checkbox groups

score 1 · Answer 1

Your code contains serious errors that make it not work. And those errors can be easily seen in the JavaScript console. My recommendation would be that you learn to use it because it will save you a lot of time and it will make you a better developer.

By executing the code you have, you can see that the problem is in this part:

....
labels : [for (var i = valores.length - 1; i >= 0; i--) 
            {
                valores[i].fechfactura;
            },],
....

Where the following syntax error is displayed in the JavaScript console:

Unexpected token for

That is, you can not have a for loop in that site (within the definition of an array). A simple solution: create the value of the array with the loop for out of the definition and then simply assign it where appropriate. Something like this:

....
success: function(data){
    var valores = JSON.parse(data);

    // crea el valor del array fuera de la definición
    var valorLabels = [];
    for (var i = valores.length - 1; i >= 0; i--)  {
        valorLabels[i] = valores[i].fechfactura;
    }

    var Datos = {
                    labels : valorLabels,
    ....

Another error that you will find later: data : [valores] ; The variable valores is already an array, you do not need to do [valores] , that line should be data: valores

score 0 · Answer 2

It is only necessary to map the vector or json like this:

...
labels : [valores.map((el) =>el.fechfactura)],
...

If you print that yourself, go through the vector and extract the data. Which is more advisable is not necessary to make a for, which would look a little less practical.