Sample Finance Vol Sh A
CSS
HTML
JS
// JS
 // JS
var options = {
  type: 'navigatorCandlestickRounded',
  palette: 'fiveColor3',
  yAxisFormatString: 'c',
  navigator: {
    toolbarVisible: false,
    xScrollbarEnabled: false,
    previewAreaVisible: false
  },
  series: [
    {
      name: 'Purchases',
      points: [
        [ new Date(2010, 1, 1), 28.39, 28.48, 27.92, 28.41, 85931100  ],
        [ new Date(2010, 1, 2), 28.37, 28.5, 28.14, 28.46, 54413700  ],
        [ new Date(2010, 1, 3), 28.26, 28.79, 28.12, 28.63, 61397900  ],
        [ new Date(2010, 1, 4), 28.38, 28.5, 27.81, 27.84, 77850000  ],
        [ new Date(2010, 1, 5), 28, 28.28, 27.57, 28.02, 80960100  ],
        [ new Date(2010, 1, 8), 28.01, 28.08, 27.57, 27.72, 52820600  ],
        [ new Date(2010, 1, 9), 27.97, 28.34, 27.75, 28.01, 59195800  ],
        [ new Date(2010, 1, 10), 28.03, 28.24, 27.84, 27.99, 48591300  ],
        [ new Date(2010, 1, 11), 27.93, 28.4, 27.7, 28.12, 65993700  ],
        [ new Date(2010, 1, 12), 27.81, 28.06, 27.58, 27.93, 81117200  ],
        [ new Date(2010, 1, 16), 28.13, 28.37, 28.02, 28.35, 51935600  ],
        [ new Date(2010, 1, 17), 28.53, 28.65, 28.36, 28.59, 45882900  ],
        [ new Date(2010, 1, 18), 28.59, 29.03, 28.51, 28.97, 42856500  ],
        [ new Date(2010, 1, 19), 28.79, 28.92, 28.69, 28.77, 44451800  ],
        [ new Date(2010, 1, 22), 28.84, 28.94, 28.65, 28.73, 36707100  ],
        [ new Date(2010, 1, 23), 28.68, 28.83, 28.09, 28.33, 52266200  ],
        [ new Date(2010, 1, 24), 28.52, 28.79, 28.38, 28.63, 43165900  ],
        [ new Date(2010, 1, 25), 28.27, 28.65, 28.02, 28.6, 48735300  ],
        [ new Date(2010, 1, 26), 28.65, 28.85, 28.51, 28.67, 40370600  ],
        [ new Date(2010, 2, 1), 28.77, 29.05, 28.53, 29.02, 43805400  ],
        [ new Date(2010, 2, 2), 29.08, 29.3, 28.24, 28.46, 93123900  ],
        [ new Date(2010, 2, 3), 28.51, 28.61, 28.35, 28.46, 48442100  ],
        [ new Date(2010, 2, 4), 28.46, 28.65, 28.27, 28.63, 42890600  ],
        [ new Date(2010, 2, 5), 28.66, 28.68, 28.42, 28.59, 56001800  ],
        [ new Date(2010, 2, 8), 28.52, 28.93, 28.5, 28.63, 39414500  ],
        [ new Date(2010, 2, 9), 28.56, 29.11, 28.55, 28.8, 50271600  ],
        [ new Date(2010, 2, 10), 28.86, 29.11, 28.8, 28.97, 44891400  ],
        [ new Date(2010, 2, 11), 28.89, 29.19, 28.85, 29.18, 35349700  ],
        [ new Date(2010, 2, 12), 29.32, 29.38, 29.04, 29.27, 31700200  ],
        [ new Date(2010, 2, 15), 29.18, 29.37, 29.01, 29.29, 37512000  ],
        [ new Date(2010, 2, 16), 29.42, 29.49, 29.2, 29.37, 36723500  ],
        [ new Date(2010, 2, 17), 29.5, 29.87, 29.4, 29.63, 50385700  ],
        [ new Date(2010, 2, 18), 29.63, 29.72, 29.5, 29.61, 43845200  ],
        [ new Date(2010, 2, 19), 29.76, 29.9, 29.35, 29.59, 81332100  ],
        [ new Date(2010, 2, 22), 29.5, 29.7, 29.39, 29.6, 37718200  ],
        [ new Date(2010, 2, 23), 29.59, 29.9, 29.41, 29.88, 42026600  ],
        [ new Date(2010, 2, 24), 29.72, 29.85, 29.6, 29.65, 33987700  ],
        [ new Date(2010, 2, 25), 29.83, 30.57, 29.8, 30.01, 73168700  ],
        [ new Date(2010, 2, 26), 30.09, 30.2, 29.59, 29.66, 55595500  ],
        [ new Date(2010, 2, 29), 29.71, 29.82, 29.55, 29.59, 33336000  ],
        [ new Date(2010, 2, 30), 29.63, 29.86, 29.5, 29.77, 34954800  ],
        [ new Date(2010, 2, 31), 29.64, 29.72, 29.17, 29.29, 63760000  ],
        [ new Date(2010, 3, 1), 29.35, 29.54, 28.62, 29.16, 74768100  ],
        [ new Date(2010, 3, 5), 29.13, 29.43, 29.03, 29.27, 34331200  ],
        [ new Date(2010, 3, 6), 29.15, 29.58, 28.98, 29.32, 47366800  ],
        [ new Date(2010, 3, 7), 29.16, 29.56, 29.14, 29.35, 58318800  ],
        [ new Date(2010, 3, 8), 29.32, 29.98, 29.3, 29.92, 63713800  ],
        [ new Date(2010, 3, 9), 29.95, 30.41, 29.9, 30.34, 54752500  ],
        [ new Date(2010, 3, 12), 30.25, 30.49, 30.21, 30.32, 37068800  ],
        [ new Date(2010, 3, 13), 30.15, 30.5, 30.13, 30.45, 41374600  ],
        [ new Date(2010, 3, 14), 30.79, 31, 30.66, 30.82, 68941200  ],
        [ new Date(2010, 3, 15), 30.82, 30.95, 30.71, 30.87, 52745400  ],
        [ new Date(2010, 3, 16), 30.79, 30.98, 30.6, 30.67, 88703100  ],
        [ new Date(2010, 3, 19), 30.77, 31.25, 30.76, 31.04, 64970300  ],
        [ new Date(2010, 3, 20), 31.22, 31.44, 31.13, 31.36, 52199500  ],
        [ new Date(2010, 3, 21), 31.33, 31.5, 31.23, 31.33, 55343100  ],
        [ new Date(2010, 3, 22), 31.04, 31.53, 30.9, 31.39, 84847600  ],
        [ new Date(2010, 3, 23), 31.12, 31.58, 30.65, 30.96, 126766600  ],
        [ new Date(2010, 3, 26), 31, 31.28, 30.86, 31.11, 63649300  ],
        [ new Date(2010, 3, 27), 30.95, 31.25, 30.75, 30.85, 68730900  ],
        [ new Date(2010, 3, 28), 30.92, 31, 30.62, 30.91, 64557900  ],
        [ new Date(2010, 3, 29), 30.93, 31.43, 30.67, 31, 52665200  ],
        [ new Date(2010, 3, 30), 31.07, 31.08, 30.52, 30.54, 63214800  ],
        [ new Date(2010, 4, 3), 30.67, 31.06, 30.58, 30.86, 43989500  ],
        [ new Date(2010, 4, 4), 30.52, 30.55, 29.75, 30.13, 82085600  ],
        [ new Date(2010, 4, 5), 29.77, 30.09, 29.69, 29.85, 66833800  ],
        [ new Date(2010, 4, 6), 29.59, 29.88, 27.91, 28.98, 128613000  ],
        [ new Date(2010, 4, 7), 28.93, 28.95, 27.32, 28.21, 173718100  ],
        [ new Date(2010, 4, 10), 29.01, 29.48, 28.71, 28.94, 86653300  ],
        [ new Date(2010, 4, 11), 28.68, 29.65, 28.57, 28.88, 63789400  ],
        [ new Date(2010, 4, 12), 28.98, 29.58, 28.92, 29.44, 47146800  ],
        [ new Date(2010, 4, 13), 29.26, 29.73, 29.18, 29.24, 45188800  ],
        [ new Date(2010, 4, 14), 29.2, 29.21, 28.64, 28.93, 63334000  ],
        [ new Date(2010, 4, 17), 29.12, 29.23, 28.45, 28.94, 46053300  ],
        [ new Date(2010, 4, 18), 28.87, 29, 28.4, 28.6, 52690600  ],
        [ new Date(2010, 4, 19), 28.52, 28.69, 27.79, 28.24, 61746700  ],
        [ new Date(2010, 4, 20), 27.65, 27.84, 27.04, 27.11, 87991100  ],
        [ new Date(2010, 4, 21), 26.63, 27.11, 26.44, 26.84, 117596300  ],
        [ new Date(2010, 4, 24), 26.85, 26.86, 26.26, 26.27, 73652800  ]
      ]
    }
  ]
};

var volData= function(){
	var result = {points:[]};
	for(var i in options.series[0].points){
	 var p = options.series[0].points[i];
	 result.points.push([p[0],p[5]]);
	}
	result.type='column';
	result.name='Volume';
	return result;
}();
var ohlcData= function(){
	var result = {points:[]};
	for(var i in options.series[0].points){
	 var p = options.series[0].points[i];
	 result.points.push([p[0],p[1],p[2],p[3],p[4]]);
        //Remove extra data from original points
        options.series[0].points[i] = options.series[0].points[i].splice(0,5)
	}

	result.name='MSFT Price';
	return result;
}();
options.series[0]=ohlcData;
options.chartArea = [
{height:.75},
{series:[volData],yAxis:{label:{text:'Volume'},scaleRangeMax:350000000}}
];
options.series[0].yAxis=0;
var $chartEl = $('#chartDiv'),chart;
$chartEl.JSC(options);
chart = $chartEl.JSC();
PHP