Highcharts.setOptions({lang :{ rangeSelectorZoom : "", /*rangeSelectorFrom : "", rangeSelectorTo : "",*/ }}); $(document).ajaxStart(function() { $(underlyingChart.loadingContainer).show(); }); $(document).ajaxStop(function() { $(underlyingChart.loadingContainer).hide(); }); $(window).on('resize.underlyingChart', function(e) { //console.log('resize'); underlyingChart.updateSeriesPosition(); underlyingChart.chart.reflow(); $('.highcharts-crosshair ').css('visibility','hidden'); //$.each(underlyingChart.emptySlot, function(index, value){ underlyingChart.drawEmptyBackground(); //}); }); var underlyingChart = { chart : null, cur_chart : null, data : null, period: 0, emptySlot:["","","","","",""], usedSlot : ["","","","","",""], usedMASlot : ["","","","",""], //maColors : ["#61A1C6","#a1af00","#82389b","#e60028","#fbc189"], maColors : ["#F48B28","#FF68D3","#00DEBB","#9FA1F3","#BC6BC6"], maIndex : {10: 0, 20: 1, 50: 2, 100:3, 250:4}, maIndex2 : [10,20,50,100,250], navigatorUpdated : null, toolTipMoved : null, selectedRange : [-1,-1], stockcode: "", comparecode : "", backgroundColor: "", selected_ts:0, loadingContainer:null, charttype: "candlestick", lastTooltipPoint:null, isMobile: ($(".mobile_header").is(":hidden"))?false:true, mobileHeight:{true:85, false:100}, mobileTop:{true:30, false:0}, lastObj: null, isFx: 0, isUS: 0, init : function(code, callback, navUpdated, ttMoved){ var self = this; var delay = (typeof isSameOrigin !== "undefined" && isSameOrigin*1 == 0)? '/delay/1': ''; self.navigatorUpdated = (navUpdated!==undefined)?navUpdated:null; self.toolTipMoved = (ttMoved!==undefined)?ttMoved:null; $.getJSON('/'+lang+'/data/chart/underlyingChart/code/'+code+'/period/'+self.period + delay, function(_data) { self.data = self.decode(_data); var htmlContainer = null; if ($('#underlyingChartContainer .highcharts-html-container').length>0){ htmlContainer = $('#underlyingChartContainer .highcharts-html-container'); } self.stockcode = code; self.fdate = _data.mainData.fdate; self.edate = _data.mainData.edate; self.isFx = _data.mainData.isFx; self.isUS = _data.mainData.isUS; $('#underlyingChartContainer').highcharts('StockChart',self.getJSON(self.data), function (chart){ if ($(chart.renderTo).attr("id")){ if (!$('#underlyingChartContainer').hasClass("noSetting")){ if (htmlContainer){ $('#underlyingChartContainer').append(htmlContainer); }else{ $('#underlyingChartContainer').append("
"); $('#underlyingChartContainer .highcharts-html-container').append("
"); self.loadingContainer = $('#underlyingChartContainer .highcharts-html-container .highcharts-loading'); } } self.chart = chart; self.cur_chart = chart; self.drawBackground(); if(type!="index"){ self.setPeriod(self.data.last[self.data.last.length-1][0]- (60*60*24*1000)*365,self.data.last[self.data.last.length-1][0]); }else{ self.setPeriod(self.data.last[self.data.last.length-1][0]- (60*60*24*1000)*365+(60*60*24*1000)*183,self.data.last[self.data.last.length-1][0]); } self.changeChartType(self.charttype); if (callback){ callback(); } $("#startDay, #endDay").datepicker({ dateFormat: 'yy-mm-dd', minDate: self.fdate, maxDate: self.edate }); $("#startDay, #endDay").change(function(){ var startDay = $("#startDay").val(); var endDay = $("#endDay").val(); if(startDay!="" && endDay!=""){ self.setPeriod(Date.parse(startDay),Date.parse(endDay)); } }); }else{ chart.reflow(); } }); }); }, decode : function(_data){ var data = _data.mainData.underlying; var ohlc = [], volume = [],turnover = [],last = [], recommData = []; for (i = 0; i < data.length; i++) { ohlc.push({ x: data[i].ts, y: data[i].last, high: data[i].high, low: data[i].low, open: data[i].open, close: data[i].last, }); last.push([ data[i].ts, // the date data[i].last // close ]); volume.push([ data[i].ts, // the date data[i].vol // the volume ]); turnover.push([ data[i].ts, // the date data[i].turnover // the turnover ]); } for(var i = 0; i < _data.recommData.length; i++){ let y; if(_data.recommData.length>1){ if(i == 0){ y = (_data.recommData[i].value*1 > _data.recommData[i+1].value*1) ? -10 : 11; }else{ y = (_data.recommData[i].value*1 > _data.recommData[i-1].value*1) ? -10 : 11; } }else{ y = -10; } recommData.push({ //properties for plotlines className: "recomm", width: 2, value: _data.recommData[i].value*1, //color: "#ed8b00", //line color color: _data.recommData[i].wtypeValue.toLowerCase() == 'call'? "#4D7AA7": "#ed8b00", zIndex: 4, label:{ useHTML: true, text: '
' + _data.recommData[i].code + '(' + _data.recommData[i].wtype + ')' + '
', y: y, x: 0, style: { color: 'white', } }, //properties for hover tooltip uname: _data.recommData[i].uname, code: _data.recommData[i].code, wtype: _data.recommData[i].wtype, egearing: _data.recommData[i].egearing, mdate: _data.recommData[i].mdate, wtypeValue: _data.recommData[i].wtypeValue, }); } return {ohlc : ohlc, vol:volume, turnover: turnover, last:last, recommData: recommData,}; }, options : { groupingUnits : [['day',[1]],], chartHeight : 270, chartTop : 23, subChartTitle : 23, }, getJSON : function(data){ var self = this; return { chart : { animation: false, renderTo: 'underlyingChartContainer', backgroundColor : (self.toolTipMoved !=null)?"rgba(255, 255, 255, 0.0)":"#FFFFFF", marginLeft: 0, marginRight: 70, marginTop: this.options.chartTop, events: { load: function(){ if (this == self.chart){ //self.refreshSeries(); }else{ //console.log("load: copy"); self.cur_chart = this; //self.refreshSeries(); setTimeout(function(){ self.cur_chart = self.chart; }, 100); } }, redraw: function(event) { if ((self.selectedRange[0]!=event.target.xAxis[0].min || self.selectedRange[1]!=event.target.xAxis[0].max) || (self.selectedRange[0]==-1 && self.selectedRange[1]==-1)){ //console.log("redraw",self.navigatorUpdated); self.selectedRange[0] = event.target.xAxis[0].min; self.selectedRange[1] = event.target.xAxis[0].max; if (self.navigatorUpdated){ self.navigatorUpdated(event.target.xAxis[0].min,event.target.xAxis[0].max); } } }, click: function(event) { $('.highcharts-crosshair').css('visibility','visible'); } } }, annotationsOptions: { enabled: true, noButtons: true, /*buttonsElementId: "underlyingMasterTools",*/ }, exporting: { enabled: false, /*url: "http://hsbc2.dbpower.com.hk/highchart_export/export.php",*/ }, plotOptions: { candlestick: { oxymoronic: true, color: '#e60028', lineColor: '#e60028', upColor: '#1a9656', upLineColor: '#1a9656' }, area: { threshold: null, }, series: { turboThreshold: 2000, states:{ hover: { enabled: false, } } } }, tooltip: { backgroundColor: "rgba(0,0,0,0)", borderWidth: 0, borderRadius: 0, useHTML: true, positioner: function(width, height, point){ var pos = this.getPosition(width, height, point); if (self.lastTooltipPoint && self.lastTooltipPoint.series.type == "line"){ var _point = self.lastTooltipPoint.point; pos.y = _point.plotY; } return pos; }, formatter : function(){ self.drawToolTip(this,false); if (underlyingChart.chart.annotations.selected > 0){ return ""; } var html = ''; var tooltipHead; if($("#underlyingChartContainer .recomProduct:hover").length == 1){ let hoverEle = $("#underlyingChartContainer .recomProduct:hover"); let hoverCode = hoverEle.attr("value"); $.each( data.recommData, function(key) { //console.log(data.recommData[key].code ); let recommCode = data.recommData[key].code; let wtypeStr = data.recommData[key].wtype; if(recommCode == hoverCode){ //恒指認購證12345 let spacer = ""; if(lang == "en_hk"){ spacer = " "; } tooltipHead = data.recommData[key].uname + spacer + wtypeStr + " " + recommCode; let valueName, egearingName; if(data.recommData[key].wtypeValue == "CALL" || data.recommData[key].wtypeValue == "PUT"){ valueName = self.labels()[lang].strike; egearingName = self.labels()[lang].egearing; }else{ valueName = self.labels()[lang].calllv; egearingName = self.labels()[lang].gearing; } html += '
'+ valueName +'' + data.recommData[key].value + '
'; html += '
'+ self.labels()[lang].maturity +'' + data.recommData[key].mdate + '
'; html += '
'+ egearingName +'' + data.recommData[key].egearing + '
'; } }); }else{ if (Highcharts.dateFormat('%H:%M', this.points[0].x) != "00:00"){ tooltipHead = Highcharts.dateFormat('%Y-%m-%d %H:%M', this.points[0].x); }else{ tooltipHead = Highcharts.dateFormat('%Y-%m-%d', this.points[0].x); } if (this.points[0].series.type == "line"){ self.lastTooltipPoint = this.points[0]; html += '
'+self.labels()[lang].toolTip.underlyinglast+'
'+this.points[0].y+"
"; }else{ self.lastTooltipPoint = null; html += '
'+self.labels()[lang].toolTip.underlyinghigh+''+this.points[0].point.high+"
"; html += '
'+self.labels()[lang].toolTip.underlyinglow+''+this.points[0].point.low+"
"; html += '
'+self.labels()[lang].toolTip.underlyingopen+''+this.points[0].point.open+"
"; html += '
'+self.labels()[lang].toolTip.underlyinglast+''+this.points[0].point.close+"
"; } var k=3; for(var i =0; i0){ if (self.usedMASlot[i].indexOf("_bol-")>0){ while(_index>0 && typeof this.points[_index].point.high == "undefined"){ _index--; } var val = formatPrice(this.points[_index+1].y); var _val1 = formatPrice(this.points[_index].point.high); var _val2 = formatPrice(this.points[_index].point.low); html += '
'+self.labels()[lang].toolTip.MASlot[5][0]+''; html += ''+val+"
"; html += '
'+self.labels()[lang].toolTip.MASlot[5][2]+''; html += ''+_val2+"
"; html += '
'+self.labels()[lang].toolTip.MASlot[5][1]+''; html += ''+_val1+"
"; }else if(self.usedMASlot[i].indexOf("_compare")>0){ var val = formatPrice(this.points[_index].y); html += '
'+self.labels()[lang].toolTip.MASlot[i]+'
'; html += ''+val+"
"; }else{ var val = formatPrice(this.points[_index].y); html += '
'+self.labels()[lang].toolTip.MASlot[i]+''; html += ''+val+"
"; } k++; } } } } html = '
'+tooltipHead+'
'+html+'
'; return html; }, shadow: false, }, rangeSelector : { enabled: false, selected: 1 }, xAxis:{ type: 'datetime', gridLineWidth: 0, lineWidth: 0, tickColor: '#00000000', tickPixelInterval:200, crosshair: { width: 1, color: "#000", zIndex: 4 }, tickPositioner: function () { var positions = []; var _last = 0; if (Highcharts.dateFormat('%H:%M', this.max) != "00:00"){ return null; } //console.log(data.last); if(data.last.length > 1){ for (var i=0;i=this.min && tick<=this.max){ var _date = new Date(tick); var _flag; if ((this.max-this.min)>3600*1000*24*30*36){ _flag = Math.floor(_date.getMonth()%6); }else if ((this.max-this.min)>3600*1000*24*30*12){ _flag = Math.floor(_date.getMonth()%3); }else if ((this.max-this.min)>3600*1000*24*30*3){ _flag = _date.getDate(); }else{ _flag = _date.getDay(); } if (_flag < _last && tick != this.min){ positions.push(tick); } _last = _flag; } } }else if(data.last.length == 1){ positions.push(data.last[0][0]); } return positions; }, labels: { formatter: function () { if (Highcharts.dateFormat('%H:%M', this.value) != "00:00"){ if (lang == "en_hk"){ if (Highcharts.dateFormat('%H%M', this.value)*1 < 920 && (self.isUS!=1 && self.isFx!=1) ){ return Highcharts.dateFormat('%b %d 09:20', this.value); } return Highcharts.dateFormat('%b %d %H:%M', this.value); }else{ if (Highcharts.dateFormat('%H%M', this.value)*1 < 920 && (self.isUS!=1 && self.isFx!=1) ){ return Highcharts.dateFormat('%m月%d日 09:20', this.value); } return Highcharts.dateFormat('%m月%d日 %H:%M', this.value); } }else{ if (lang == "en_hk"){ return Highcharts.dateFormat('%b %d', this.value); }else{ return Highcharts.dateFormat('%m月%d日', this.value); } } } }, opposite: true, offset: this.options.chartHeight*-1-30, }, yAxis: [{ labels:{ formatter: function () { return formatPrice(this.value); }, align:'left', x: 3, y: 4, }, plotLines: data.recommData, gridLineWidth: (self.toolTipMoved !=null)?0:1, height: this.options.chartHeight, top:this.options.chartTop, opposite: true, showFirstLabel: false, showLastLabel: true, crosshair: {width: 1,color: "#000",snap:false,zIndex: 4}, }, { labels:{ formatter: function () { return formatPrice(this.value); }, align:"left", x: 3, }, opposite: false, height: this.options.chartHeight, top:this.options.chartTop, }, { top:this.options.chartHeight-43, height: 90, gridLineWidth: 0, labels:{ enabled: false }, }, { top:0,height: 100,title: {text: null,},offset: 0,tickAmount : 5,opposite: true,showFirstLabel: false,showLastLabel: false, labels:{formatter: this.subChartLabelFormatter,align:'left',x: 3,y: 4, style: { textOverflow: 'none', whiteSpace: 'nowrap'}}, crosshair: {width: 1,color: "#000",snap:false,zIndex: 4}, },{ top:0,height: 100,title: {text: null,},offset: 0,tickAmount : 5,opposite: true,showFirstLabel: false,showLastLabel: false, labels:{formatter: this.subChartLabelFormatter,align:'left',x: 3,y: 4, style: { textOverflow: 'none', whiteSpace: 'nowrap'}}, crosshair: {width: 1,color: "#000",snap:false,zIndex: 4}, },{ top:0,height: 100,title: {text: null,},offset: 0,tickAmount : 5,opposite: true,showFirstLabel: false,showLastLabel: false, labels:{formatter: this.subChartLabelFormatter,align:'left',x: 3,y: 4, style: { textOverflow: 'none', whiteSpace: 'nowrap'}}, crosshair: {width: 1,color: "#000",snap:false,zIndex: 4}, },{ top:0,height: 100,title: {text: null,},offset: 0,tickAmount : 5,opposite: true,showFirstLabel: false,showLastLabel: false, labels:{formatter: this.subChartLabelFormatter,align:'left',x: 3,y: 4, style: { textOverflow: 'none', whiteSpace: 'nowrap'}}, crosshair: {width: 1,color: "#000",snap:false,zIndex: 4}, },{ top:0,height: 100,title: {text: null,},offset: 0,tickAmount : 5,opposite: true,showFirstLabel: false,showLastLabel: false, labels:{formatter: this.subChartLabelFormatter,align:'left',x: 3,y: 4, style: { textOverflow: 'none', whiteSpace: 'nowrap'}}, crosshair: {width: 1,color: "#000",snap:false,zIndex: 4}, },{ top:0,height: 100,title: {text: null,},offset: 0,tickAmount : 5,opposite: true,showFirstLabel: false,showLastLabel: false, labels:{formatter: this.subChartLabelFormatter,align:'left',x: 3,y: 4, style: { textOverflow: 'none', whiteSpace: 'nowrap'}}, crosshair: {width: 1,color: "#000",snap:false,zIndex: 4}, }], navigator : { enabled : (typeof longversion == "undefined")?true:false, series: { data: data.last, }, height : 60, }, scrollbar : { enabled : false }, series : [{ id : "vol", type: 'column', name: 'vol', data: data.vol, yAxis: 2, color: "#cad3da", dataGrouping: { approximation: "sum", units: self.options.groupingUnits, groupPixelWidth: 1000 } },{ name: 'primary', type: 'candlestick', id: 'primary', data : data.ohlc, yAxis: 0, dataGrouping: { units: self.options.groupingUnits, groupPixelWidth: 1000 } }], }; }, refreshSeries : function(){ var chart = this.cur_chart; var _series = []; for (var i=0;i0 && this.cur_chart!=this.chart){ for (var j=0;j0){ chart.tooltip.refresh(_series); } }, setPeriod : function(_from,_to){ if (this.data.last[0][0]){ this.chart.xAxis[0].setExtremes(Math.max(_from,this.data.last[0][0]), _to); $("#startDay").val(Highcharts.dateFormat('%Y-%m-%d', Math.max(_from,this.data.last[0][0]))); $("#endDay").val(Highcharts.dateFormat('%Y-%m-%d', _to)); } }, setPeriod2 : function(period){ if (this.data.last[0][0]){ var endDay = this.edate; var d = new Date(endDay); d.setMonth(d.getMonth() - period); d.setDate(d.getDate() + 1); var yyyy = d.getFullYear().toString(); var mm = (d.getMonth()+1).toString(); var dd = d.getDate().toString(); var startDay = yyyy +"-"+ (mm[1]?mm:"0"+mm[0]) +"-"+ (dd[1]?dd:"0"+dd[0]); this.setPeriod(Date.parse(startDay),Date.parse(endDay)); } }, drawToolTip: function(obj, isReset){ //console.log("start drawToolTip"); //console.log(obj); //var chart = this.chart; this.lastObj = obj; var chart = this.cur_chart; var fontstyle = {color: '#666666', fontSize: '13px'}; var textattr = {zIndex: 7, class: "tooltipElement"}; //if ($(".tooltipElement.s"+obj.points[0].x).length>0){ if(!isReset){ if ($(".tooltipElement.s"+obj.points[0].x).length>0 && this.cur_chart == this.chart){ return; } } if (this.cur_chart == this.chart){ $(".tooltipElement").remove(); } if (this.toolTipMoved){ this.toolTipMoved(obj.points[0].x); } //chart.renderer.text(Highcharts.dateFormat('%y/%m/%d',obj.points[0].x), 15, 18).css(fontstyle).attr(textattr).add(); try { for(var j = 0; j0 || obj.points[j].series.name.indexOf("_ema")>0 ){ /*for(var i =0; i0){ chart.renderer.text("SMA("+days+"):"+formatPrice(obj.points[j].y), 130*_index+35, 36).css(fontstyle).attr(textattr).add(); }else{ chart.renderer.text("EMA("+days+"):"+formatPrice(obj.points[j].y), 130*_index+35, 36).css(fontstyle).attr(textattr).add(); }*/ }else if (obj.points[j].series.name.indexOf("_compare")>0){ /*chart.renderer.text(this.labels()[lang].toolTip.MASlot.compare, 15, 38).css(fontstyle).attr(textattr).add(); chart.renderer.text("C:"+formatPrice(obj.points[j].y), 90, 38).css(fontstyle).attr(textattr).add(); */ }else if (obj.points[j].series.name.indexOf("_bol")>0 && obj.points[j].point.high){ /* var _label1 = this.labels()[lang].toolTip.MASlot.bol[0]+"("+obj.points[j].series.options.p1+","+obj.points[j].series.options.p2+"): "; var _label2 = this.labels()[lang].toolTip.MASlot.bol[1]+": "; var _label3 = this.labels()[lang].toolTip.MASlot.bol[2]+": "; _label1 += (obj.points[j+1].y).toFixed(2); _label2 += (obj.points[j].point.high).toFixed(2); _label3 += (obj.points[j].point.low).toFixed(2); chart.renderer.text(_label1, 15, 38).css(fontstyle).attr(textattr).add(); chart.renderer.text(_label2, 240, 38).css(fontstyle).attr(textattr).add(); chart.renderer.text(_label3, 390, 38).css(fontstyle).attr(textattr).add(); */ }else if (obj.points[j].series.name.indexOf("_sar")>0){ /*var _label = this.labels()[lang].toolTip.MASlot.sar+"("+obj.points[j].series.options.p1+","+obj.points[j].series.options.p2+"): "; _label += (obj.points[j].y).toFixed(3); chart.renderer.text(_label, 15, 38).css(fontstyle).attr(textattr).add(); */ }else{ var segment = obj.points[j].series.name.split("_"); if (segment.length==2){ textattr.class = "tooltipElement text_subchart"; var index = segment[0].replace("s","")*1; var offset = (this.isMobile)?45:27; var _top = (this.options.chartHeight+this.options.chartTop)+((this.mobileHeight[this.isMobile]+this.options.subChartTitle)*index)+(this.mobileTop[this.isMobile]*index)+offset; for(var i =0; i" + val3; }else{ _val = val1 + " " + val2 + " " + val3; } }else if (segment[1] == "turnover"){ _val = this.labels()[lang].toolTip.TASlot[segment[1]]+": "+(addcomma(obj.points[j].y)); }else{ _val = this.labels()[lang].toolTip.TASlot[segment[1]]+": "+(obj.points[j].y).toFixed(3); } if(this.isMobile){ chart.renderer.text(_val, 0, _top+16).css(fontstyle).attr(textattr).add(); }else{ var clientwidth = chart.renderer.text(_val, 0, -100).css(fontstyle).attr(textattr).add().element.getBoundingClientRect().width; chart.renderer.text(_val, chartWidth - underlyingChart.chart.margin[1] - clientwidth - 5, _top+16).css(fontstyle).attr(textattr).add(); } } } } } } catch (err) { //console.log(err); } $(".tooltipElement:eq(0)").attr("class",$(".tooltipElement:eq(0)").attr("class")+" s"+obj.points[0].x); //console.log("end drawToolTip"); this.drawBackground(); }, drawBackground: function(){ /* let recomCSS = { "text-decoration": "none", "color": "#000000", };*/ //$('.recomProduct a').css(recomCSS); if (this.cur_chart == this.chart){ $(".tooltipBackground").remove(); $(".tooltipLabel").remove(); } //$(".tooltipBackground").remove(); //$(".tooltipLabel").remove(); //var chart = this.chart; var chart = this.cur_chart; var fontstyle = {color: '#666666', fontSize: '13px'}; var textattr = {zIndex: 7,class: "tooltipLabel"}; //var offsetx,offsety; chart.renderer.rect(0, 0, 1920, 22, 0).attr({ fill: '#FFFFFF', stroke: '#000', 'stroke-width': 0, zIndex: 5, class: "tooltipBackground" }).add(); chart.renderer.text(this.labels()[lang].yTitle1, 0, 15).css({color: '#4F8ABD', fontSize: '13px'}).attr(textattr).add(); var j=0; for (var i=0;i=0;k--){ if (chart.series[k].name && chart.series[k].name == this.usedSlot[i]){ if (chart.series[k].userOptions.p1){ days = "("+chart.series[k].userOptions.p1; if (chart.series[k].userOptions.p2){ days += ","+chart.series[k].userOptions.p2; if (chart.series[k].userOptions.p3){ days += ","+chart.series[k].userOptions.p3; } } days += ")"; } } } // var _y = _top+41+(this.mobileTop[this.isMobile]*(j+1)); // if(this.isMobile){ // _y = _top+15+(this.mobileTop[this.isMobile]*(j+1)); // } chart.renderer.text(this.labels()[lang].subTitle[chartType]+days, 0, _top+16).css(fontstyle).attr(textattr).add(); j++; } } }, changeChartType: function (type){ var self = this; if (type != this.chart.series[1].type){ if (self.period!=0 && (self.isUS==1 || self.isFx==1)){ type = "line"; } this.charttype = type; if(type == "line") { _width = 2; } else { _width = 1; } if(type == 'candlestick') { _color = "#e60028"; }else{ _color = "#000000"; } this.chart.series[1].update({ type: type, lineWidth: _width, color: _color, }); } }, changePeriodType: function (type,callback){ var self = this; $(".chart_type").show(); if (type.endsWith("min")){ $(".range").hide(); if (self.isUS==1 || self.isFx==1){ $(".chart_type").hide(); self.charttype = "line"; } this.period = type.replace("min","")*1; if(self.isFx==1){ this.period = 10; } this.options.groupingUnits = [["minute",[this.period]],]; console.log(this); this.init(this.stockcode,function(){ self.setPeriod(self.data.last[Math.max(self.data.last.length-71,0)][0],self.data.last[self.data.last.length-1][0]); callback(); },this.navigatorUpdated,this.toolTipMoved); return; }else if (this.period != 0){ $(".range").show(); this.period = 0; this.options.groupingUnits = [[type,[1]],]; this.init(this.stockcode,callback,this.navigatorUpdated,this.toolTipMoved); return; } this.chart.series.forEach(function(ser) { ser.update({ dataGrouping: { units: [ [type, [1]] ] } }, false); }); this.options.groupingUnits = [[type,[1]],]; this.chart.redraw(); this.selected_ts = this.chart.xAxis[0].tickPositions[this.chart.xAxis[0].tickPositions.length-1]; }, addCompare: function (code,callback){ var self = this; if (code==""){ this.chart.yAxis[1].setTitle({text:""}); this.addMAline("",0); return; } var delay = (typeof isSameOrigin !== "undefined" && isSameOrigin*1 == 0)? '/delay/1': ''; $.getJSON('/'+lang+'/data/chart/underlyingChart/code/'+code+ delay+"/period/"+self.period, function(_data) { var compare = []; var data = _data.mainData; for (i = 0; i < data.underlying.length; i++) { compare.push({ x: data.underlying[i]["ts"], y: data.underlying[i]["last"], high: data.underlying[i]["high"], low: data.underlying[i]["low"], open: data.underlying[i]["open"], close: data.underlying[i]["last"], vol: data.underlying[i]["vol"], }); } if (compare.length>0){ for(var i =0; i=0;i--){ if (chart.series[i].name && (chart.series[i].name == this.usedMASlot[_id[j]] || chart.series[i].name.startsWith(this.usedMASlot[_id[j]]+"_"))){ chart.series[i].remove(); } } } this.setUsedMASlot(_id[j], ""); } }, addMAline: function(type, id){ var chart = this.chart; var self = this; //return; if (type!=""){ var tempArr = type.split("-"); var _type = tempArr[0]; var _para = "?type="+_type; for (var i=1; i0){ self.setUsedMASlot(_index, series[i].name); } }else{ series[i].name = "t"+id+"_"+type; self.setUsedMASlot(id, "t"+id+"_"+type); } chart.addSeries(series[i]); } self.addSettingBox(_type); chart.yAxis[0].update(); self.drawEmptyBackground(); }); } }else{ self.removeMAline(id); } //chart.setSize(this.options.chartWidth,this.getChartHeight()); }, removeSeries: function(id){ var chart = this.chart; var yAxisID = id + 3; if (this.usedSlot[id] != ""){ for (var i=chart.series.length-1;i>=0;i--){ if (chart.series[i].name && (chart.series[i].name == this.usedSlot[id] || chart.series[i].name.startsWith(this.usedSlot[id]+"_"))){ chart.series[i].remove(); chart.yAxis[yAxisID].userOptions.top = 0; chart.yAxis[yAxisID].userOptions.min = null; chart.yAxis[yAxisID].userOptions.max = null; } } } this.setUsedSlot(id, ""); }, drawline:function(renderer, lineColor, zIndex, x1, y1, x2, y2){ renderer.path(['M', x1, y1,'L', x2, y2]).attr({ stroke: lineColor, //stroke: 'red', 'stroke-width': 1, opacity: 1, class :'gridline', zIndex: zIndex, }).add(); }, drawEmptyBackground: function(){ let self = this; let chart = this.chart; $('#underlyingChartContainer .gridline').remove(); let offsetTop = 49; var totalsubchart=0; for (var i=0;i=0 && type!="" && !(type == "vol" || type == "turnover")){ var tempArr = type.split("-"); var _type = tempArr[0]; var _para = "?type="+_type; for (var i=1; i0){ return; } var chartWidth = $('#underlyingChartContainer').width(); var sbox = '
'; var cbox = ''; container.append(sbox+cbox);*/ }, updateSeriesPosition: function(){ var chart = this.chart; this.isMobile = ($(".mobile_header").is(":hidden"))?false:true; var j=0; for (var i=0;i=0 && id=0 && id0 || self.usedMASlot[0].indexOf("_ema")>0 ){ // command = (self.usedMASlot[0].split("_"))[1]; // for(var i=1;i0){ var _value = (self.usedMASlot[i].split("-")); for(var j=1; j<_value.length;j++){ command += "-"+_value[j]; } }else{ if(self.usedMASlot[i]!=""){ command += "-"+(self.usedMASlot[i].split("-"))[1]; // self.addMAline(command, i); } } } if (command){ self.addMAline(command, -1); } for(var i=0;i0)?".HK":"")+"價格", subTitle : { macd : "移動平均匯聚背馳指標", rsi : "相對強弱指數", turnover : this.stockcode + ((this.stockcode*1>0)?".HK":"") + " 成交額", }, toolTip : { open:"O:", high:"H:", low:"L:", last:"C:", volume:"成交量:", underlyinghigh: this.stockcode + " 最高價", underlyinglow: this.stockcode + " 最低價", underlyingopen: this.stockcode + " 開市價", underlyinglast: this.stockcode + " 價格", MASlot: ["10天移動平均線","20天移動平均線","50天移動平均線","100天移動平均線","250天移動平均線",["保歷加平均線","保歷加下限線","保歷加上限線"],adddigit(this.comparecode) + " 價格"], TASlot: { turnover:"成交額", rsi:"RSI", macd:["MACD-棒形圖","MACD","MACD-訊號"], }, }, calllv : "收回價", maturity : "到期日", strike : "行使價", gearing : "實際槓桿", egearing : "實際槓桿", x: "倍", call : "認購", put : "認沽", bull : "牛證", bear : "熊證", }, zh_cn :{ unit:{ K:"千", M:"百万", B:"十亿", }, yTitle1 : this.stockcode + ((this.stockcode*1>0)?".HK":"")+"价格", subTitle : { macd : "移动平均汇聚背驰指标", rsi : "相对强弱指数", turnover : this.stockcode + ((this.stockcode*1>0)?".HK":"")+ " 成交额", }, toolTip : { open:"O:", high:"H:", low:"L:", last:"C:", volume:"成交量:", underlyinghigh: this.stockcode + " 最高价", underlyinglow: this.stockcode + " 最低价", underlyingopen: this.stockcode + " 开市价", underlyinglast: this.stockcode + " 价格", MASlot: ["10天移动平均线","20天移动平均线","50天移动平均线","100天移动平均线","250天移动平均线",["保历加平均线","保历加下限线","保历加上限线"],adddigit(this.comparecode) + " 价格"], TASlot: { turnover:"成交额", rsi:"RSI", macd:["MACD-棒形图","MACD","MACD-讯号"], }, }, calllv : "收回价", maturity : "到期日", strike : "行使价", gearing : "实际杠杆", egearing : "实际杠杆", x: "倍", call : "认购", put : "认沽", bull : "牛证", bear : "熊证", }, en_hk :{ unit:{ K:"K", M:"M", B:"B", }, yTitle1 : this.stockcode + ((this.stockcode*1>0)?".HK":"")+ " last", subTitle : { macd : "MACD", rsi : "RSI", turnover : this.stockcode + ((this.stockcode*1>0)?".HK":"")+ " Turnover", }, toolTip : { open:"O:", high:"H:", low:"L:", last:"C:", volume:"Volume:", underlyinghigh: this.stockcode + " high", underlyinglow: this.stockcode + " low", underlyingopen: this.stockcode + " open", underlyinglast: this.stockcode + " last", MASlot: ["SMA-10","SMA-20","SMA-50","SMA-100","SMA-250",["Moving average","Bollinger lower bound","Bollinger upper bound"],adddigit(this.comparecode) + " last"], TASlot: { turnover:"Turnover", rsi:"RSI", macd:["MACD-histogram","MACD","MACD-signal"], }, }, calllv : "Call level", maturity : "Maturity", strike : "Strike", gearing : "Gearing", egearing : "Eff.Gearing", x: "X", call : "Call", put : "Put", bull : "Bull", bear : "Bear", }, }; _out["edu"] = _out["zh_cn"]; _out["zh-hk"] = _out["zh_hk"]; _out["zh-cn"] = _out["zh_cn"]; _out["en-hk"] = _out["en_hk"]; _out["edu-zh_hk"] = _out["zh_hk"]; _out["edu-zh_cn"] = _out["zh_cn"]; _out["edu-en_hk"] = _out["en_hk"]; return _out; }, }