multiple plotBands from array

[jared.collier]

I'm trying to create multiple plotbands on a datetime x-axis that change depending on the data that's being passed in for the chart. I have successfully pulled out each start and end point, storing the values as strings:

Code: Select all

var plotBandsArray = ['{from: ' + startDate1 + ', to: ' + endDate1 + '}', '{from: ' + startDate2 + ', to: ' + endDate2 + '}', etc...]


which yields the equivalent of something like:

['{from: 389059200000, to: 391737600000}', '{from: 389059200000, to: 394329600000}', etc...]

then passing that to HighCharts like:

Code: Select all

plotBands: plotBandsArray,


Secondly, storing them in a subarray of the plotbands array:

Code: Select all

var plotBandsArray = [[389059200000, 391737600000], [389059200000, 394329600000], [389059200000, 397008000000], etc...];


then passing that to HighCharts like:

Code: Select all

plotBands: plotBandsArray,


Lastly, I tried storing them in a subarray again, but using a function to pull out the start and end values within plotBands like so:

Code: Select all

plotBands: function() {
            var i = 0;
            while (i < plotBandsArray.length) {
               from: plotBandsArray[i];
               to: plotBandsArray[i+1];
               
               i += 2;
            }
},


None of the date values are hardcoded, but are instead generated dynamically from the data passed into HighCharts. Any help formatting the array of plot band points, as well as processing tips for said array would be extremely helpful.

[Fusher]

In your first example is problem with that you are creating strings inside array, when you should have array of objects (just remove " ' " ) or use something like this: http://jsfiddle.net/Fusher/DTUdd/

[jared.collier]

That worked perfectly, thank you very much.