Highcharts.setOptions({lang :{
	// rangeSelectorZoom : "",
	noData : "沒有相關資料",
}});
var turnoverChart = {
	chart : null,
	type : null,
	mode : "desktop",
	init : function(type){
		var self = this;	
		this.type = type;
		self.mode = (window.innerWidth<991)?"mobile":"desktop";
		$.getJSON('/?q=/'+lang+'/data/chart/turnoverChart/type/'+type, function(_data) {
			var data = self.decode(_data);
			// $('#turnoverChartContainer').highcharts(self.getJSON(data), function (chart){
			$('#turnoverChartContainer').highcharts('StockChart',self.getJSON(data), function (chart){
				self.chart = chart;
				self.drawBackground();
			});
		});
	},
	decode : function(_data){
		return _data.mainData;
	},
	colors : {line1 : "#DC6801", gridline: "#E6E6E6"}, 
	getJSON : function(data){
		var pturnover = data.pturnover;
		var min_pturnover = 0;
		var _xaixs = Array();
		if(pturnover){
			min_pturnover = pturnover[0][1];
			for (i = 0; i < pturnover.length; i++) {
				min_pturnover = Math.min(min_pturnover, pturnover[i][1]);
				
				_xaixs[i] = pturnover[i][0];
			}
		}

		var self = this;
		return {
			chart : {
				
				type: 'column',
				marginLeft: 60,
				height: ((self.mode == "mobile") ? 200 : 300),
				events: {
					redraw: function(event) {
						self.drawBackground();
					}
				}
			},
			rangeSelector: {
				enabled: false,
			},
			title: {
				text: "",
			},
			legend: {
				enabled: false,
			},
			plotOptions: {
				line: {
	
					events: {
						legendItemClick: function () {
							return false; 
						}
					}
				},
				column: {
                    animation: false,

                }
			},
			tooltip: {
				useHTML: true,
				formatter: function() {
					var _html = '<div class="chart_tooltip">' + Highcharts.dateFormat('%d %b', this.x) + '</b>';
					_html += '<br/><b><span style="color:'+self.colors["line1"]+'">'+self.labels[lang][self.type].yTitle1Tooltip+':</span> ' + addcomma(this.points[0].y)+ '';
					return _html;
				}
			},
			xAxis:{
				type: 'datetime',
				lineWidth: 0,
				gridLineWidth: 0,
				tickColor: '#00000000',
				lineColor: '#00000000',
				labels: {
					style: {color: this.colors["line1"], fontSize:"13px"}	,
					formatter: function () {
						// return Highcharts.dateFormat('%d %b', this.value);
						return Highcharts.dateFormat('%m/%d', this.value);
					}            
				},
				tickPositions: _xaixs
			},
			yAxis: [{
				title: {
					enabled : false,
				},
				labels:{
					align:'left',
					x:-50,
					y:5,
					style: {color: "#000", fontSize:"13px"}	,
					formatter: function () {
						return addcomma(this.value);					
					}   
				},
				showFirstLabel: false,
				showLastLabel: true,
				//min: min_pturnover,
				lineWidth: 1,
				lineColor: self.colors["gridline"],
				opposite: false,
			}],
			navigator : {
				enabled : false,
				// top:540
			},
			scrollbar : {
				enabled : false
			},
			series : [{
				data : data.pturnover,
				color : this.colors["line1"],
				pointWidth : ((self.mode == "mobile") ? 15 : 50),
			}
			],
			exporting: {
				enabled: false
			}
		};
	},
	drawBackground: function(){
		var chart = this.chart;
		var offsetx,offsety;
		
		offsetx = 10;
		offsety = chart.chartHeight - 40;	
		
		chart.renderer.text(this.labels[lang].yTitle, offsetx, offsety).css({
			fontSize: '15px',
			id :'drawYaxisText',
		}).add();
	},
	labels : {
		tc :{
			cbbc: {	
				yTitle1Tooltip : "牛熊證總成交(萬)",
			},
			warrant:{
				yTitle1Tooltip : "權證總成交(萬)",
			},
			yTitle: "單位(萬)",
		},
		sc :{
		},
		en :{
		},
	},
}