Organize Chart bar by date

Asked

Viewed 93 times

0

Using the Chartjs, I am generating a bar graph comparing the current and previous month, the day and amount of the payment made. The problem is that the Labels have a range from 1 to 31, the chart data does not correctly track the values.

The code below

;var chartJS_w0 = new Chart(document.getElementById('w0').getContext('2d')).Bar({
    "labels":[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31],
    "datasets":{
        "1":{"data":[1600.7500305176,1154.9299926758,6404.6300048828,1609.1199951172,1189.7799987793,386.72999572754,1110.3299942017,720.71999359131,1307.1999816895,12326.089944839,735.86999511719,2125.9599761963,17231.699935913,4276.4899749756,1115.2200012207,5191.6699905396,4281.6599273682,1750,5896.2799987793],

        "fillColor":"#b9ea45",
        "strokeColor":"#0d8cba",
        "highlightFill":"#2d11b2",
        "highlightStroke":"#b153de"},

        "2":{
            "data":[2458.1199874878,1400,679.55999755859,412.92999267578],

            "fillColor":"#d8d59a",
            "strokeColor":"#d2dcfe",
            "highlightFill":"#d4a021",
            "highlightStroke":"#2acbda"
        }
    }
}, {});

Generates the graph: inserir a descrição da imagem aqui

However, it feeds the graph continuously. For example: The second dataset has the values

"data":[2458.1199874878,1400,679.55999755859,412.92999267578],

And they should be pointed at the Abels:

"label":["1","2","5","6"]

Not 1,2,3,4

1 answer

0


The solution was to go through the array date and verify which days there was no payment recorded, assigning the value zero. So that the amounts were interspersed according to the payment day:

"data":[2458.1199874878,1400, 0, 679.55999755859,412.92999267578 ,0,0,0,0,0,0.....]

Browser other questions tagged

You are not signed in. Login or sign up in order to post.