How can I change the colors of my highcharts piechart?

Question

I'm using highcharts to make a piechart but I'm having trouble loading a custom color set for my chart.

Here is my code:

     <script type="text/javascript">      $(function () {      Highcharts.setOptions({      colors: ['#50B432', '#ED561B', '#DDDF00', '#24CBE5', '#64E572', '#FF9655', '#FFF263',      '#6AF9C4']     });     return new Highcharts.Chart({           chart: {             renderTo: 'trailpiechart',             plotBackgroundColor: null,             plotBorderWidth: null,             plotShadow: false,             backgroundColor: "#f8f8f8",             margin: [20, 20, 20, 20]         },           credits: {             enabled: false         },          title: {             text: caption         },         tooltip: {             formatter: function () {                 return this.y + ' links';             }         },         plotOptions: {             pie: {                 allowPointSelect: true,                 cursor: 'pointer',                 dataLabels: {                     enabled: false                 },                 showInLegend: true             }         },         legend: {             layout: 'vertical',             floating: false,             borderRadius: 0,             borderWidth: 0         },         series: [{             type: 'pie',             name: 'Browser share',             data: data         }]     });     }); </script> 

My pie chart works with this code but it only uses the default color pallet.

How do you specify a custom color set?

Answer 1

Highcharts.setOptions({  colors: ['#50B432', '#ED561B', '#DDDF00', '#24CBE5', '#64E572', '#FF9655', '#FFF263', '#6AF9C4'] }); 

Look the following example http://jsfiddle.net/8QufV/

Answer 2

For those of you that prefer to initialize the color in the configs, you could simply put the colors in the plotOptions portion of the config object like so:

..., plotOptions: {   pie: {    colors: [      '#50B432',       '#ED561B',       '#DDDF00',       '#24CBE5',       '#64E572',       '#FF9655',       '#FFF263',       '#6AF9C4'    ],    allowPointSelect: true,    cursor: 'pointer',    dataLabels: {      enabled: false    },    showInLegend: true  } }, ...