quoslibero
Version:
FusionCharts JavaScript charting framework
1 lines • 13.7 kB
JavaScript
import{getMouseCoordinate,extend2,pluckNumber,parseUnsafeString,pluck,UNDEF,convertColor,getFirstColor}from'../../../../fc-core/src/lib';import MSLine from'../msline';import ZoomLineDataset from'../../dataset/zoomline';import datasetFactory from'../../factories/zoomline-dataset';import{priorityList}from'../../../../fc-core/src/schedular';import{scrollTo}from'../_internal/utils/scroll-apis';import{symbolList}from'../_internal/utils/iconsymbol';import{getDep}from'../../../../fc-core/src/dependency-manager';let userAgent=window.navigator.userAgent,Raphael=getDep('redraphael','plugin'),doc=window.doc,isIE=/msie/i.test(userAgent)&&!window.opera,TRACKER_FILL='rgba(192,192,192,'+(isIE?.002:1e-6)+')',toFloat=window.parseFloat,PIPE='|',PX='px',toInt=window.parseInt,BLANK='',math=Math,mathMax=math.max,mathMin=math.min,mathCeil=math.ceil,mathFloor=math.floor,count=0,fireMouseEvent=function(a,b,c){var d;b&&a&&(!c&&(c={}),c.originalEvent&&(c=c.originalEvent),c.touches&&(c=c.touches[0]),b.dispatchEvent?(MouseEvent?d=new MouseEvent(a,{bubbles:!!c.bubbles,cancelable:!!c.cancelable,clientX:c.clientX||c.pageX&&c.pageX-doc.body.scrollLeft-doc.documentElement.scrollLeft||0,clientY:c.clientY||c.pageY&&c.pageY-doc.body.scrollTop-doc.documentElement.scrollTop||0,screenX:c.screenX||0,screenY:c.screenY||0,pageX:c.pageX||0,pageY:c.pageY||0}):doc.createEvent&&(d=doc.createEvent('HTMLEvents'),d.initEvent(a,!!c.bubbles,!!c.cancelable)),d.eventName=a,d&&b.dispatchEvent(d)):doc.createEventObject&&b.fireEvent&&(d=doc.createEventObject(),d.eventType=a,d.eventName=a,b.fireEvent('on'+a,d)))},isWithinCanvas=function(a,b){var c=b.get('config'),d=getMouseCoordinate(b.get('linkedItems','container'),a,b),e=d.chartX,f=d.chartY,g=c.canvasLeft,h=c.canvasTop,i=c.canvasLeft+c.canvasWidth,j=c.canvasHeight+c.canvasTop;return d.insideCanvas=!1,d.originalEvent=a,e>g&&e<i&&f>h&&f<j&&(d.insideCanvas=!0),d};Raphael.addSymbol(symbolList);class ZoomLine extends MSLine{static getName(){return'ZoomLine'}static includeInputOptions(){return['DragZoomIn','DragPin','ZoomResetButton','ZoomOutButton']}constructor(){var a=Math.ceil;super(),this.canvasborderthickness=1,this.zoomX=!0,this.hasScroll=!0,this.eiMethods={zoomOut:function(a){var b,c=this.apiInstance,d=c.getChildren&&c.getChildren('canvas')[0],e=d&&d.getChildren('inputManager');e=e&&e[0];c&&e&&c.addJob(`zoomOut${count++}`,function(){b=e.zoomOut(),'function'==typeof a&&a(b)},priorityList.postRender)},zoomTo:function(a,b,c){var d,e=this,f=e.apiInstance,g=f.getChildren&&f.getChildren('canvas')[0],h=g&&g.getChildren('inputManager');if(void 0!==a&&void 0!==b)return h=h&&h[0],f&&h?c?void f.addJob(`zoomTo${count++}`,function(){d=h.zoomTo(a,b),'function'==typeof c&&c(d)},priorityList.postRender):h.zoomTo(a,b):void 0},resetChart:function(){var a=this.apiInstance,b=a.getChildren&&a.getChildren('canvas')[0],c=b&&b.getChildren('inputManager'),d=function(){c.resetChart()};c=c&&c[0];a&&c&&a.addJob(`resetChart${count++}`,d,priorityList.postRender)},setZoomMode:function(a){var b=this.apiInstance,c=b.getChildren&&b.getChildren('canvas')[0],d=c&&c.getChildren('inputManager');d=d&&d[0];b&&d&&b.addJob(`setZoomMode${count++}`,function(){d.setZoomMode(a)},priorityList.postRender)},getViewStartIndex:function(b){var c,d,e,f=this.apiInstance;return b?void f.addJob(`getViewStartIndex${count++}`,function(){'function'==typeof b&&(c=f.getChildren('xAxis')[0],d=c.getVisibleConfig().minValue,e=a(d),b(0===e?0:e))},priorityList.postRender):(c=f.getChildren('xAxis')[0],d=c.getVisibleConfig().minValue,e=a(d),0===e?0:e)},getViewEndIndex:function(a){var b,c,d=Math.floor,e=this.apiInstance;return a?void e.addJob(`getViewEndIndex${count++}`,function(){'function'==typeof a&&(b=e.getChildren('xAxis')[0],c=b.getVisibleConfig().maxValue,a(d(c)))},priorityList.postRender):(b=e.getChildren('xAxis')[0],c=b.getVisibleConfig().maxValue,d(c))}},this.eiMethods.scrollTo=scrollTo,this.registerFactory('dataset',datasetFactory,['vCanvas'])}__setDefaultConfig(){super.__setDefaultConfig();let a=this.config;a.friendlyName='Zoomable and Panable Multi-series Line Chart',a.defaultDatasetType='zoomline',a.showValues=0,a.zeroplanethickness=1,a.zeroplanealpha=40,a.showzeroplaneontop=0,a.enablemousetracking=!0,a.skipAttr=!0,a.showvalues=0}getName(){return'ZoomLine'}parseChartAttr(a){super.parseChartAttr(a);let b=this,c=b.config,d=a||b.getFromEnv('dataSource'),e=d.chart;c.useCrossline=+e.usecrossline||e.usecrossline===UNDEF?1:0,c.drawTrendRegion=0}getInputConfigurations(){var a=this,b=a.config,c=function(c,d){a.addJob('inputZoom',()=>{var e=b.viewPortConfig;e.dsi=c,e.dei=d,a.updateManager(),a.getChildren('xAxis')[0].prepareAttributes()},priorityList.configure)},d={dragZoomIn:{scaleX:!0,scaleY:!1,drawButton:!1,boxStyle:{stroke:b.zoomPaneStroke,fill:b.zoomPaneFill,"stroke-width":0},catZoomLimit:2,skipGraphics:!0,dragendFn:(...a)=>c(a[1],a[2])},zoomResetButton:{hookFn:c,tooltext:b.btnResetChartTooltext},zoomOutButton:{hookFn:c,tooltext:b.btnZoomOutTooltext},dragPin:{orientation:'horizontal',attr:{stroke:b.zoomPaneStroke,fill:b.zoomPaneFill,"stroke-width":0},skipGraphics:!b.allowPinMode,pinAttr:{"stroke-width":0,stroke:'none',fill:b.pinPaneFill,"shape-rendering":'crisp'},strokeWidth:0,tooltext:b.showToolBarButtonTooltext&&b.btnSwitchToPinModeTooltext||BLANK}};return d}_setCategories(){var a,b,c,d,e=this,f=e.config,g=e.getFromEnv('dataSource'),h=g.chart||{},i=e.getChildren('xAxis'),k=f.cdm,l=f.cdmchar,m=g.categories&&g.categories[0].category||[];if(f.cdm=k=pluckNumber(h.compactdatamode,0),f.cdmchar=l=pluck(h.dataseparator,PIPE),(k||'string'==typeof m)&&m.split){for(a=m.split(l),b=[],(c=0,d=a.length);c<d;c+=1)b.push({label:a[c]});e.config.categories=g.categories[0].category=b}i[0].setAxisPadding(0,0),i[0].setTickValues(b||m)}isWithinCanvas(a,b){return isWithinCanvas.call(this,a,b)}highlightPoint(a,b,c,d,e,f){var g,h=this,i=h.config,j=h.getFromEnv('animationManager'),k=h.components,l=h.graphics,m=+a,n=l.tracker,o=k.dataset[e],p=o&&o.config,q=o&&p.zoomedRadius||0,r=o&&p.hoverCosmetics,s=r&&r.fill,t=r&&r.borderColor,u=r&&r.borderThickness,v={click:function(a){h.plotEventHandler(this,a)},hoverIn:function(a){h.plotEventHandler(this,a,'dataplotRollover')},hoverOut:function(a){h.plotEventHandler(this,a,'dataplotRollout')}};n||(g=l.tracker=j.setAnimation({el:'circle',attr:{cx:0,cy:0,r:q,fill:m?s:TRACKER_FILL,stroke:m?t:TRACKER_FILL,"stroke-width":m?u:0,"clip-rect":i.canvasLeft+','+i.canvasTop+','+i.canvasWidth+','+i.canvasHeight},container:l.trackerGroup,component:h}).on('fc-click',v.click).hover(v.hoverIn,v.hoverOut)),d&&g.data('eventArgs',{x:d.x,y:d.y,tooltip:d.tooltip,link:d.link}),i.lastHoveredPoint=d,h.getFromEnv('toolTipController').enableToolTip(g,f),g.transform('t'+(b+i.canvasLeft)+','+(c+i.canvasTop)),d&&fireMouseEvent('mouseover',g&&g.node,i.lastMouseEvent)}configureAttributes(a){super.configureAttributes(a);var b,c,d=this,e=d.getFromEnv('dataSource'),f=e.chart||{},g=d.getFromEnv('color-manager'),h=g.getColor('canvasBorderColor'),i=pluckNumber(f.showtoolbarbuttontooltext,1);c=d.config,b=c.style,c.stepZoom=400/(100-pluckNumber(f.stepzoom,25)),2>=c.stepZoom&&(c.stepZoom=1.9),extend2(c,{useRoundEdges:pluckNumber(f.useroundedges,0),zoomType:'x',canvasPadding:pluckNumber(f.canvaspadding,0),scrollColor:getFirstColor(pluck(f.scrollcolor,g.getColor('altHGridColor'))),scrollShowButtons:!!pluckNumber(f.scrollshowbuttons,1),scrollHeight:pluckNumber(f.scrollheight,16)||16,scrollBarFlat:pluckNumber(f.flatscrollbars,0),allowPinMode:pluckNumber(f.allowpinmode,1),skipOverlapPoints:pluckNumber(f.skipoverlappoints,1),showToolBarButtonTooltext:i,btnResetChartTooltext:i?pluck(f.btnresetcharttooltext,'Reset Chart'):'',btnZoomOutTooltext:i?pluck(f.btnzoomouttooltext,'Zoom out one level'):'',btnSwitchToZoomModeTooltext:i?pluck(f.btnswitchtozoommodetooltext,'<strong>Switch to Zoom Mode</strong><br/>Select a subset of data to zoom into it for detailed view'):'',btnSwitchToPinModeTooltext:i?pluck(f.btnswitchtopinmodetooltext,'<strong>Switch to Pin Mode</strong><br/>Select a subset of data and compare with the rest of the view'):'',pinPaneFill:convertColor(pluck(f.pinpanebgcolor,h),pluckNumber(f.pinpanebgalpha,15)),zoomPaneFill:convertColor(pluck(f.zoompanebgcolor,'#b9d5f1'),pluckNumber(f.zoompanebgalpha,30)),zoomPaneStroke:convertColor(pluck(f.zoompanebordercolor,'#3399ff'),pluckNumber(f.zoompaneborderalpha,80)),showPeakData:pluckNumber(f.showpeakdata,0),maxPeakDataLimit:pluckNumber(f.maxpeakdatalimit,f.maxpeaklimit,null),minPeakDataLimit:pluckNumber(f.minpeakdatalimit,f.minpeaklimit,null),crossline:{enabled:pluckNumber(f.showcrossline,1),line:{"stroke-width":pluckNumber(f.crosslinethickness,1),stroke:getFirstColor(pluck(f.crosslinecolor,'#000000')),"stroke-opacity":pluckNumber(f.crosslinealpha,20)/100},labelEnabled:pluckNumber(f.showcrosslinelabel,f.showcrossline,1),labelstyle:{fontSize:toFloat(f.crosslinelabelsize)?toFloat(f.crosslinelabelsize)+PX:b.outCanfontSize,fontFamily:pluck(f.crosslinelabelfont,b.outCanfontFamily)},valueEnabled:pluckNumber(f.showcrosslinevalues,f.showcrossline,1),valuestyle:{fontSize:toFloat(f.crosslinevaluesize)?toFloat(f.crosslinevaluesize)+PX:b.inCanfontSize,fontFamily:pluck(f.crosslinevaluefont,b.inCanvasStyle.fontFamily)}},useCrossline:pluckNumber(f.usecrossline,1),tooltipSepChar:pluck(f.tooltipsepchar,', '),showTerminalValidData:pluckNumber(f.showterminalvaliddata,0)})}getValuePixel(a){var b=this,c=b.config,d=c.viewPortConfig;return d.ddsi+mathFloor(a/d.ppp)}getDatasets(){var a=this,b=[];return a.iterateComponents(a=>{a.getType&&'dataset'===a.getType()&&b.push(a)}),b}__preDraw(){var a,b,c,d,e,f=this,g=f.config,h=f.getFromEnv('dataSource').chart,i=g.cdm,k=f.getChildren('xAxis')[0],l=g.viewPortConfig,m=f.getChildren('canvas')[0].config,n=mathMax(m.canvasPadding,m.canvasPaddingLeft,m.canvasPaddingRight),o=f.getChildren('yAxis')[0],p=g.canvasHeight,q=f.getFromEnv('dataSource').chart,r=k.getTicksLen(),{minValue:s,maxValue:t}=k.getVisibleConfig(),u=pluckNumber(h.displaystartindex,s,1),v=pluckNumber(h.displayendindex,t,r||2),w=toInt(u,10)-1,x=toInt(v,10)-1,y=0;if(d=f.getDatasets(),e=d.length,g.borderWidth=pluckNumber(q.showborder,1)?pluckNumber(q.borderthickness,1):0,g.updateAnimDuration=500,g.status='zoom',g.maxZoomLimit=pluckNumber(h.maxzoomlimit,1e3),g.viewPortHistory=[],1>(b=pluckNumber(h.pixelsperpoint,15))&&(b=1),(c=pluckNumber(h.pixelsperlabel,h.xaxisminlabelwidth,k.getAxisConfig('labels').rotation?20:60))<b&&(c=b),(0>w||w>=(r-1||1))&&(w=0),(x<=w||x>(r-1||1))&&(x=r-1||1),l=g.viewPortConfig=extend2(g.viewPortConfig,{amrd:pluckNumber(h.anchorminrenderdistance,20),nvl:pluckNumber(h.numvisiblelabels,0),cdm:i,oppp:b,oppl:c,dsi:w,dei:x,vdl:x-w,clen:r,offset:0,step:1,llen:0,alen:0,ddsi:w,ddei:x,ppc:0}),!!l.clen){for(;e--;)a=d[e].config,y=mathMax(y,a.drawanchors&&(a.anchorradius||0)+(+a.anchorborderthickness||0)||0);g.overFlowingMarkerWidth=y,n=g.canvasPadding=mathMax(y,n),g._prezoomed=l.dei-l.dsi<l.clen-1,g._visw=Math.max(1,g.canvasWidth-2*n),g._visx=g.canvasLeft+n,g._visout=-(g.height+p+1e3),g._yminValue=o.getLimit().min,g._ymin=o.getPixel(g._yminValue),pluckNumber(h.displaystartindex,h.displayendindex)&&k.setVisibleConfig(u,v),f.updateManager()}}resetZoom(){var a=this,b=a.config,c=b.viewPortHistory,d=c[0];return!!c.length&&(c.length=0,a.zoomTo(d.dsi,d.dei,d)&&a.fireChartInstanceEvent('zoomReset',a._zoomargs,[a.getFromEnv('chartInstance').id]),!0)}zoomOut(){var a,b,c,d,e,f=this,g=f.config,h=g.viewPortHistory;return a=h.pop(),b=h[0]||g.viewPortConfig,a?(c=a.dsi,d=a.dei):g._prezoomed&&(c=0,d=b.clen-1),e=f.zoomTo(c,d,a),e&&f.fireChartInstanceEvent('zoomedout',e),!0}zoomRangePixels(a,b){var c,d,e=this,f=e.config,g=f.viewPortConfig,h=g.ppp,i=g.ddsi;c=i+mathFloor(a/h),d=i+mathFloor(b/h),g.dsi=c,g.dei=d,e.updateManager()}prepareAttributes(){this.config.hasChartMessage||(this.__preDraw(),super.prepareAttributes())}getValue(a){var b=this,c=b.config,d=c.viewPortConfig,e=b.getOriginalPositions(a.x,a.y,a.x,a.y),f=e[0],g=e[1],h=b.getChildren('xAxis')[0],i=b.getChildren('yAxis')[0],j=h.config.axisRange,k=i.config.axisRange,l=j.min,m=j.max,n=k.max,o=k.min,p=c.canvasWidth*d.scaleX/(m-l),q=c.canvasHeight*d.scaleY/(n-o);return{x:l+(f-c.canvasLeft)/p,y:n-(g-c.canvasTop)/q}}getOriginalPositions(a,b,c,d){var e,f,g,h,i=this,j=i.config,k=j.viewPortConfig,l=k.scaleX,m=k.scaleY,n=k.x,o=k.y,p=mathMin(a,c),q=mathMax(a,c),r=mathMin(b,d),s=mathMax(b,d);return q=q>j.canvasWidth?j.canvasWidth:q,s=s>j.canvasHeight?j.canvasHeight:s,p=0>p?0:p,r=0>r?0:r,e=(q-p)/l,f=(s-r)/m,g=n+p/l,h=o+r/m,[g,h,e,f]}updateManager(){var a,b,c,d,e,f,g,h,j,k,l,m,n,o,p,q,r,s=this,t=this.getDatasets(),u=t.length,v=s.config,w=v.viewPortConfig,x=v._visw,y=s.getChildren('xAxis')[0],z=function(a){return y.getPixel(a,{wrtVisible:!0})},A=y.getAxisConfig('labels').style;if(v.legendClicked){for(a=0;a<u;a+=1)t[a].draw();return}w||(w=v.viewPortConfig),e=w.oppp,q=g=w.nvl,m=w.dsi,n=w.dei,f=w.vdl=n-m,g=w.ppl=q?x/q:w.oppl,j=w.step=(h=w.ppp=x/f)<e?mathCeil(e/h):1,k=w.lskip=mathCeil(mathMax(g,toFloat(A.lineHeight))/h/j),o=w.dsi,p=w.dei,w.offset=0,l=w.norm=o%j,w.ddsi=o-=l,w.ddei=p=p+2*j-l,w._ymin=v._ymin,w._yminValue=v._yminValue,w.x=(z(o)-z(y.getVisibleConfig().minValue)+w.offset)/w.scaleX,w.scaleX=p-o>y.getTicksLen()?1:y.getTicksLen()/Math.abs(p-o-j-.9),r=y.getVisibleConfig(),c=Math.ceil((r.maxValue-r.minValue+1)/q),d=v.viewPortConfig&&v.viewPortConfig.scaleX,b=Math.max(Math.round(y.getAxisConfig('labelStep')/d),q?c:k*j),y.setLabelConfig({step:b})}getParsedLabel(a){var b=this.xlabels;return b.parsed[a]||(b.parsed[a]=parseUnsafeString(b.data[a]||BLANK))}_setAxisScale(){var a=this.getChildren('xAxis')[0];a.setScrollType('always')}getDSdef(){return ZoomLineDataset}}export default ZoomLine;