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

Question

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?

Answer 1

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
                }
            ]

        }