How to loop through highcharts theme

Question

I want to loop over a theme of highchart:

Highcharts.theme = {
    yAxis: {
        opposite: true,
        lineWidth: 0, // Linie ganz rechts      
    },
    navigation: {
        buttonOptions: {
            align: 'left'
        }
    },   
    rangeSelector: {
        selected: 1
    }
};

As result, I need pairs of key/values:

yAxis.opposite / true
yAxis.lineWidth / 0
navigation.buttonOptions.align / left
rangeSelector.selected / 1

Can anyone help in the best way to do this?

Do you realise that you have never once accepted an answer that someone has given to one of your questions ? If someone has taken the trouble to offer you some help, the very least you can do is click 'accept' against their answer to indicate that it is correct. — SteveP, Jun 12 '14 at 09:53
It's just simple object. See [that question](http://stackoverflow.com/questions/8312459/iterate-through-object-properties). — Paweł Fus, Jun 12 '14 at 10:22

score 1 · Accepted Answer · answered Jun 12 '14 at 13:03

You can walk through a javascript object my using a for loop. Something like this would walk through the theme (down to three levels deep) and put the key/values into an array:

var myVals = [];
for (var key in Highcharts.theme) {   
  if (Highcharts.theme.hasOwnProperty(key)) {
     var obj = Highcharts.theme[key];
     for (var prop in obj) {
        if (obj.hasOwnProperty(prop)) {
          if (typeof obj[prop] === 'object') {
             for (var prop2 in obj[prop]) {
               var myKey = key + "." + prop + "." + prop2;
               myVals[myKey] = obj[prop][prop2];
             }
          } else {
            var myKey = key + "." + prop;
            myVals[myKey] = obj[prop];
          }
        }
     }
  }
}
console.log(myVals);

If you had a deeper level of nested values, then you would probably be better off re-writing this using a recursive function.

How to loop through highcharts theme

1 Answers1