var homeMflowChart={mode:"desktop",chart:null,init:function(code,callback){var self=this;self.mode=(window.innerWidth<991)?"mobile":"desktop";$.getJSON('?q=/'+lang+'/data/chart/homeMflowChart/ucode/'+code,function(_data){var data=self.decode(_data);var date=self.decode_date(_data);var name=self.decode_name(_data);$('#homeMflowChartContainer').highcharts(self.getJSON(data,date,name),function(chart){self.chart=chart;self.drawBackground();if(callback!==undefined){callback(chart,data)}})})},decode:function(_data){return _data.mainData},decode_date:function(_data){return _data.axisData.date},decode_name:function(_data){return _data.axisData.name},colors:{bar1:"#68C369",bar2:"#F3972D",bar3:"#1D76B4",bar4:"#FAC635"},margin:{mobile:70,desktop:80},chartheight:{mobile:218,desktop:262},getJSON:function(data,date,name){var bar1=[];var bar2=[];var bar3=[];var bar4=[];var lastbar1=[];var lastbar2=[];var lastbar3=[];var lastbar4=[];var max1=0;var max2=0;for(i=0;i<data.length;i++){var ec=(Math.abs(data[i]['ec']*1)>0)?data[i]['ec']*1:null;var ep=(Math.abs(data[i]['ep']*1)>0)?data[i]['ep']*1:null;var rc=(Math.abs(data[i]['rc']*1)>0)?data[i]['rc']*1:null;var rp=(Math.abs(data[i]['rp']*1)>0)?data[i]['rp']*1:null;if(i==data.length-1){bar1.push(null);bar2.push(null);bar3.push(null);bar4.push(null);lastbar1.push(ec);lastbar2.push(ep);lastbar3.push(rc);lastbar4.push(rp);max2=Math.max(max2,Math.abs(ec));max2=Math.max(max2,Math.abs(ep));max2=Math.max(max2,Math.abs(rc));max2=Math.max(max2,Math.abs(rp))}else{bar1.push(ec);bar2.push(ep);bar3.push(rc);bar4.push(rp);lastbar1.push(null);lastbar2.push(null);lastbar3.push(null);lastbar4.push(null);max1=Math.max(max1,Math.abs(ec));max1=Math.max(max1,Math.abs(ep));max1=Math.max(max1,Math.abs(rc));max1=Math.max(max1,Math.abs(rp))}}var self=this;return{chart:{type:'column',marginLeft:self.margin[self.mode],marginRight:self.margin[self.mode],spacingTop:20,height:lang=='en'?465:440,events:{load:function(){for(var i=0;i<2;i++){var extremes=self.chart.yAxis[i].getExtremes();console.log(extremes.min,extremes.max);if(extremes.min*-1!=extremes.max){var _max=Math.min(extremes.min*-1,extremes.max);if(_max%3!=0){_max+=(3-(_max%3))}self.chart.yAxis[i].setExtremes(_max*-1,_max)}}},redraw:function(event){self.redraw()}}},title:{text:null},legend:{enabled:true,},xAxis:{title:{text:this.labels[lang].xTitle,useHTML:true,style:{color:"#000"}},lineColor:'transparent',tickLength:0,offset:((self.mode=="mobile")?-60:0),categories:date,},yAxis:[{title:{text:this.labels[lang].yTitle1,rotation:((lang=="en")?-90:0),y:((lang=="en")?0:-50),useHTML:true,style:{color:"#000"}},tickAmount:7,showFirstLabel:false,showLastLabel:false,height:self.chartheight[self.mode],max:max1,min:max1*-1},{title:{text:this.labels[lang].yTitle2,rotation:((lang=="en")?-90:0),y:((lang=="en")?0:-50),useHTML:true,style:{color:"#000"}},top:20.1,opposite:true,tickAmount:7,showFirstLabel:false,showLastLabel:false,height:self.chartheight[self.mode],max:max2,min:max2*-1}],credits:{enabled:false},tooltip:{useHTML:true,formatter:function(){var _html='<div class="chart_tooltip">'+this.x+'';if(this.series.index<4)_html+='<br/><b><span style="color:'+this.color+'">'+self.labels[lang].yTitle1Tooltip+':</span></b> '+this.y+" "+self.labels[lang].million;else _html+='<br/><b><span style="color:'+this.color+'">'+self.labels[lang].yTitle2Tooltip+':</span></b> '+this.y+" %";return _html}},plotOptions:{column:{minPointLength:2}},series:[{name:name[0],data:bar1,color:this.colors["bar1"],yAxis:0,},{name:name[1],data:bar2,color:this.colors["bar2"],yAxis:0,},{name:name[2],data:bar3,color:this.colors["bar3"],yAxis:0,},{name:name[3],data:bar4,color:this.colors["bar4"],yAxis:0},{name:name[0],showInLegend:false,data:lastbar1,color:this.colors["bar1"],yAxis:1,},{name:name[1],showInLegend:false,data:lastbar2,color:this.colors["bar2"],yAxis:1,},{name:name[2],showInLegend:false,data:lastbar3,color:this.colors["bar3"],yAxis:1,},{name:name[3],showInLegend:false,data:lastbar4,color:this.colors["bar4"],yAxis:1}],exporting:{enabled:false},}},redraw:function(){var chart=this.chart;var offsetx,offsety;var self=this;$("#mflowchartBackground1").remove();var distance=chart.plotWidth/7;offsetx=chart.plotLeft-distance;offsety=50;for(var i=1;i<=8;i++){$("#mflowchartstockconnectpath"+i).remove();chart.renderer.path(['M',offsetx+distance*i,offsety+self.chartheight[self.mode]-20,'L',offsetx+distance*i,offsety]).attr({id:'mflowchartstockconnectpath'+i,'stroke-width':0.5,stroke:'#C0D0E0'}).add()}chart.renderer.rect(self.margin[self.mode],20,chart.plotWidth,self.chartheight[self.mode],0).attr({fill:'#F9F9F9',stroke:'#C0C0C0','stroke-width':1,id:'mflowchartBackground1',}).add()},drawBackground:function(){var chart=this.chart;var offsetx,offsety;var self=this;this.redraw()},labels:{tc:{yTitle1:"<b>資<br/>金<br/>流<br/>︵<br/>百<br/>萬<br/>港<br/>元<br/>︶</b>",yTitle2:"<b>街<br/>貨<br/>量<br/>變<br/>化<br/>︵<br/>%<br/>︶</b>",xTitle:"<b>日期</b>",yTitle1Tooltip:"資金流入",yTitle2Tooltip:"街貨量變化",million:"百萬",},sc:{yTitle1:"<b>资<br/>金<br/>流<br/>︵<br/>百<br/>万<br/>港<br/>元<br/>︶</b>",yTitle2:"<b>街<br/>货<br/>量<br/>变<br/>化<br/>︵<br/>%<br/>︶</b>",xTitle:"<b>日期</b>",yTitle1Tooltip:"资金流入",yTitle2Tooltip:"街货量变化",million:"百万",},en:{yTitle1:"Money Flow(Mllion)",yTitle2:"Outstanding Change(%)",xTitle:"<b>Date</b>",yTitle1Tooltip:"Money Flow",yTitle2Tooltip:"Outstanding Change",million:"M",},},}