Financial Chart

'Kagi' chart type customize colors

HTML

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="http://cdn.wijmo.com/5.latest/styles/wijmo.min.css">
<script src="http://cdn.wijmo.com/5.latest/controls/wijmo.min.js"></script>
<script src="http://cdn.wijmo.com/5.latest/controls/wijmo.chart.min.js"></script>
<script src="http://cdn.wijmo.com/5.latest/controls/wijmo.chart.finance.min.js"></script>
<h1> Financial Chart</h1>
<h3> Chart Type: <span style="color:skyblue">Kagi</span></h3>

<div id="Kagi"></div>

JavaScript

// create the chart
  var chart = new wijmo.chart.finance.FinancialChart('#Kagi');
 	chart.initialize( {
    itemsSource: getData(),
    bindingX: 'date',
    chartType: 'Kagi',
    legend: { position: 'None' },
    series: [
    	{ binding: 'low,high,close,open', name: 'Alphabet Inc' ,
      	
      }
		]
  });
  
  // some stock data from Google Finance
  function getData() {
    return [
  {
    date: '01/23/15',
    open: 20.2,
    high: 24.73,
    low: 20.16,
    close: 23.23,
    volume: 42593223
  },
  {
    date: '01/26/15',
    open: 23.67,
    high: 24.39,
    low: 22.5,
    close: 22.6,
    volume: 8677164
  },
  {
    date: '01/27/15',
    open: 22,
    high: 22.47,
    low: 21.17,
    close: 21.3,
    volume: 3272512
  },
  {
    date: '01/28/15',
    open: 21.62,
    high: 21.84,
    low: 19.6,
    close: 19.78,
    volume: 5047364
  },
  {
    date: '01/29/15',
    open: 19.9,
    high: 19.95,
    low: 18.51,
    close: 18.8,
    volume: 3419482
  },
  {
    date: '01/30/15',
    open: 18.47,
    high: 19.48,
    low: 18.22,
    close: 18.81,
    volume: 2266439
  },
  {
    date: '02/02/15',
    open: 19.18,
    high: 19.3,
    low: 18.01,
    close: 18.02,
    volume: 2071168
  },
  {
    date: '02/03/15',
    open: 18.22,
    high: 18.64,
    low: 18.12,
    close: 18.24,
    volume: 1587435
  },
  {
    date: '02/04/15',
    open: 18.2,
    high: 18.35,
    low: 17,
    close: 17.1,
    volume: 2912224
  },
  {
    date: '02/05/15',
    open: 17.3,
    high: 17.31,
    low: 16.41,
    close: 16.66,
    volume: 2682187
  },
  {
    date: '02/06/15',
    open: 17.39,
    high: 18.88,
    low: 17.21,
    close: 18.12,
    volume: 3929164
  },
  {
    date: '02/09/15',
    open: 18.86,
    high: 19.95,
    low: 18.45,
    close: 19.6,
    volume: 3226650
  },
  {
    date: '02/10/15',
    open: 20.5,
    high: 21,
    low: 19.63,
    close: 20.99,
    volume: 2804409
  },
  {
    date: '02/11/15',
    open: 20.89,
    high: 21,
    low: 20.2,
   ...