Demo - FlexChart Palettes

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.grapecity.com/wijmo/5.latest/styles/wijmo.min.css">
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.input.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.chart.min.js"></script>
<div class="container">

  <h1>
    FlexChart Palettes
  </h1>

  <p>
    The FlexChart automatically picks colors for each series based
    on a default palette, which you can override by setting the 
    <b>palette</b> property.</p>
  <label>
    Please select a Palette:
    <div id="thePalette"></div>
  </label>

  <div id="theChart"></div>

</div>

CSS

.wj-flexgrid {
  height: 150px; 
  margin-top:10px;
 }
 .wj-flexchart {
   height: 300px;
 }

JavaScript

onload = function() {

	// create the chart
  var theChart = new wijmo.chart.FlexChart('#theChart', {
  	itemsSource: getData(),
    bindingX: 'country',
    series: [
    	{ binding: 'sales', name: 'Sales' },
      { binding: 'expenses', name: 'Expenses' },
      { binding: 'downloads', name: 'Downloads' }
    ],
    palette: wijmo.chart.Palettes['cocoa']
  });
  
  // select the chart palette
  var thePalette = new wijmo.input.ComboBox('#thePalette', {
		itemsSource: 'Standard,Cocoa,Coral,Dark,HighContrast,Light,Midnight,Modern,Organic,Slate,Zen,Cyborg,Superhero,Flatly,Darkly,Cerulan'.split(','),
    selectedIndexChanged: function(s, e) {
    	var pal  = s.text.toLowerCase();
    	theChart.palette = wijmo.chart.Palettes[pal];
    }
  });

	// create some random data
  function getData() {
	  var countries = 'US,Germany,UK,Japan,Italy,Greece'.split(','),
	    data = [];
	  for (var i = 0; i < countries.length; i++) {
	    data.push({
	      country: countries[i],
	      sales: Math.random() * 10000,
	      expenses: Math.random() * 5000,
	      downloads: Math.round(Math.random() * 20000),
	    });
	  }
  	return data;
  }

}