How to add datas to chart js from javascript array itself?

20,427

You have to create the Array's, populate them, and only type the array name inside object without needing to surround it with [ and ]

Example:

var description = new Array();
description.push('a');
description.push('b');
var myvalues = new Array();
myvalues.push('c');
myvalues.push('d');
var barChartData = {
            labels: description,
            datasets: [
                {
                    fillColor: "rgba(220,220,220,0.5)",
                    strokeColor: "rgba(220,220,220,1)",
                    scaleOverride: true,
                    scaleSteps: 100,
                    stepValue: 1,
                    barShowStroke: false,
                    data: myvalues
                },
                {
                    fillColor: "rgba(151,187,205,0.5)",
                    strokeColor: "rgba(151,187,205,1)",
                    scaleOverride: true,
                    scaleSteps: 100,
                    barShowStroke: false,
                    stepValue: 1,
                    data: myvalues
                }
            ]

        }
Share:
20,427
sun
Author by

sun

Learning Web Technology with the help of SO:) I Love movies.

Updated on March 07, 2020

Comments

  • sun
    sun about 4 years

    I would like to use chart js in there at data structure data, if i give number as

    data : [40,80,5,190,56,55,40] working fine. If i give a array variable or string variable which holds that number like

     var myvalues = my_array.toString(); 
       alert(myvalues);
    

    am getting 5,10,14,18 for the variable as well as for array. Now when i use the array or string with the chart data i can't able to get the chart if i try like the below

    data : [myvalues]
    

    with full code for barChartData

    var barChartData = {
                labels: [description],
                datasets: [
                    {
                        fillColor: "rgba(220,220,220,0.5)",
                        strokeColor: "rgba(220,220,220,1)",
                        scaleOverride: true,
                        scaleSteps: 100,
                        stepValue: 1,
                        barShowStroke: false,
                        data: [myvalues]
                    },
                    {
                        fillColor: "rgba(151,187,205,0.5)",
                        strokeColor: "rgba(151,187,205,1)",
                        scaleOverride: true,
                        scaleSteps: 100,
                        barShowStroke: false,
                        stepValue: 1,
                        data: [myvalues]
                    }
                ]
    
            }
    

    Here description is the another variable holding information about the label this too not working.

    How to assign data and labels from javascript array or string to the chart js?