using array values in chart.js data and label field

Question

I wish to pass values of an array to the data and label fields of the chart.js dataset.

Here the code from success of ajax call made to fetch json data. I fetch the json data and store it into an array.

Data = jQuery.parseJSON(result);
var count = Data.length;
var counter = 0;
while(count > 0) {
    LabelResult[counter] =[Data[counter].TIME];
    counter++;
    count --;
}

Now i wish to use this label values into the labels filed.

var myChart = new Chart(ctx, {
    type: 'bar',
    data: {
        labels: [LabelResult],
        datasets: [{
            label: '# of Votes',
            data: [DataResult],
            borderWidth: 1
        }]
    }    
});

But there seems some issue and the data is not getting rendered on the chart

values are getting inserted into LabelResult at LabelResult[counter] =[Data[counter].TIME]; — Salil Lambay
– Salil Lambay, Commented Aug 10, 2016 at 9:55
yes this is how they are declared var LabelResult = []; var DataResult = []; — Salil Lambay
– Salil Lambay, Commented Aug 10, 2016 at 10:00
it appears as if only one label having all the array valuessuch as a stack piled up. — Salil Lambay
– Salil Lambay, Commented Aug 10, 2016 at 10:05

tata.leona · Accepted Answer · 2016-08-10 10:04:09Z

17

LabelResult is an array, change

labels: [LabelResult]

to

labels: LabelResult

Also:

data: [DataResult]

to

data: DataResult

Like:

var myChart = new Chart(ctx, {
    type: 'bar',
    data: {
        labels: LabelResult,
        datasets: [{
            label: '# of Votes',
            data: DataResult,
            borderWidth: 1
        }]
    }    
});

answered Aug 10, 2016 at 10:04

tata.leona

1,05811 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Salil Lambay Over a year ago

in case of it seem to work but now in case of labels: LabelResult but not in case of data: DataResult

legendemil · Accepted Answer · 2016-08-10 10:04:50Z

3

I think you could try to remove some brackets.

while(count > 0){
     LabelResult[counter] = Data[counter].TIME; // here removed brackets
      counter++;
      count --;
}

and

data: {
    labels: LabelResult, // here removed brackets
    datasets: [{
        label: '# of Votes',
        data: DataResult, // here removed brackets
        borderWidth: 1
    }]
},

I hope that will works.

answered Aug 10, 2016 at 10:04

legendemil

1464 bronze badges

1 Comment

Salil Lambay Over a year ago

in case of it seem to work but now in case of labels: LabelResult but not in case of data: DataResult

Collectives™ on Stack Overflow

using array values in chart.js data and label field

2 Answers 2

1 Comment

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related