How do I use a string variable in an object?

Question

I have a string, that looks like this if I log it in the console:

0.0196078431373,0.078431372549,0.0196078431373,0.0392156862745,0.0196078431373,0.0196078431373,0.0196078431373,0.0588235294118,0.0588235294118

I try to use it in an object for a chart, like this:

var barChartData = {
    labels : ["People (2.5%)","War (2.1%)","Sharing (0.8%)","Animals (1.4%)","Friends (0.3%)"],
    datasets : [
        {
            fillColor : "rgba(74,219,168,0.8)",
            strokeColor : "rgba(56,193,145,1)",
            data : [strTags]
                        }
                    ]   
                }

But the strTags isn't printed (the numbers), it shows like above. How can I fix this that it shows like this:

var barChartData = {
    labels : ["People (2.5%)","War (2.1%)","Sharing (0.8%)","Animals (1.4%)","Friends (0.3%)"],
    datasets : [
        {
            fillColor : "rgba(74,219,168,0.8)",
            strokeColor : "rgba(56,193,145,1)",
            data : [0.0196078431373,0.078431372549,0.0196078431373,0.0392156862745,0.0196078431373,0.0196078431373,0.0196078431373,0.0588235294118,0.0588235294118]
                        }
                    ]   
                }

Answer 1

You need to convert the String to an array first, eg, by using split() :

var barChartData = {
    labels : ["People (2.5%)","War (2.1%)","Sharing (0.8%)","Animals (1.4%)","Friends (0.3%)"],
    datasets : [
        {
            fillColor : "rgba(74,219,168,0.8)",
            strokeColor : "rgba(56,193,145,1)",
            data : strTags.split(',')
        }
     ]   
}

Answer 2

If you need it to be an array of numbers then you have to parse the string to a floating point number. You can do this:

var barChartData = {
    labels : ["People (2.5%)","War (2.1%)","Sharing (0.8%)","Animals (1.4%)","Friends (0.3%)"],
    datasets : [
        {
            fillColor : "rgba(74,219,168,0.8)",
            strokeColor : "rgba(56,193,145,1)",
            data : strTags.split(',').map(function(element, index, array) {
                return parseFloat(element);
            })
        }
     ]   
}

Answer 3

Another solution is JSON.parse

var barChartData = {
    labels : ["People (2.5%)","War (2.1%)","Sharing (0.8%)","Animals (1.4%)","Friends (0.3%)"],
    datasets : [
        {
            fillColor : "rgba(74,219,168,0.8)",
            strokeColor : "rgba(56,193,145,1)",
            data : JSON.parse("["+ strTags + "]");
        }
     ]   
}