How to set 'lang' property in Highcharts u

Question

We are using Highcharts in our application using Angular JS. I want to set the formatting of amounts in a user culture specific formats which I am receiving from $locale service. After refering a link i got know that we can set values in below property for Highcharts:

Highcharts.setOptions({
    lang: {
        thousandsSep: ','
    }
});

But while writing it in my code I am getting error that Highcharts is not defined, and also not working even if I set only lang property in the config object:

 function extendBaseConfiguration(config) {
      // these options are the default for all the charts.  Pass in an object to override these values (or just change them once they're returned)
    return $.extend(true, {
      chart: {
        plotBackgroundColor: null,
        plotBorderWidth: 0,
        plotShadow: false,
        borderWidth: 0
      },
      plotOptions: {
        column: {
          grouping: false,
          pointPadding: 0.2,
          borderWidth: 0
        }
      },
      lang: {
          decimalPoint: $locale.NUMBER_FORMATS.DECIMAL_SEP,
          thousandsSep: $locale.NUMBER_FORMATS.GROUP_SEP
      },
      tooltip: {  pointFormat: '{series.name}: {point.y}'},
      exporting: {enabled: true},
      credits: {enabled: false}
    }, config);
  }

So how or where could I inject this Highcharts so that I can set it's value. Or is there any other technique by which i can make the amount user culture specific formatted.

Answer 1

Try to use a setOptions inside a controller, seems that options are applied.

Highcharts.setOptions({
    lang: {
        printChart: 'Aaaa',
        thousandsSep: ','
    }
});

$scope.chartConfig = {
    options: {
        chart: {
            type: 'bar'
        }
    },
    series: [{
        data: [1000, 1500, 1200, 8000, 7000]
    }],
    title: {
        text: 'Hello'
    },

    loading: false
}

Example: http://jsfiddle.net/Hjdnw/1426/