quoslibero/vendors/fc-timeseries/src/_internal/components/dataset/column.js

FusionCharts JavaScript charting framework

import SmartRenderer from'../../../../../fc-core/src/component-interface/smart-renderer';import{pluckNumber,pluck,hasTouch,TOUCH_THRESHOLD_PIXELS,defined,CLICK_THRESHOLD_PIXELS,getMouseCoordinate,extend2,UNDEF,convertColor,safeMin,safeMax}from'../../../../../fc-core/src/lib';import markerFactory from'../../factories/marker-factory';import isValidNumber from'../../../../../fc-utils/src/type/is-valid-number';import{addDep}from'../../../../../fc-core/src/dependency-manager';import columnAnimation from'./column.animation';const ROLLOVER='DataPlotRollOver',ROLLOUT='DataPlotRollOut',_reducerFn=(a,b)=>Object.assign(a,b),CLICK='DataPlotClick',getDataPos=a=>{let b,c;return b=a.start,c=a.end,[b,c]},isDataInvalid=(a,b,c,d)=>a&&0>=b||c[1]<d[0]||c[0]>d[1],getGenericType=a=>'line'===a||'smooth-line'===a||'step-line'===a?'line':'area'===a||'smooth-area'===a||'step-area'===a?'area':void 0;var HTP=hasTouch?TOUCH_THRESHOLD_PIXELS:CLICK_THRESHOLD_PIXELS;addDep({name:'timeseriesColumnAnimation',type:'animationRule',extension:columnAnimation});class Column extends SmartRenderer{constructor(){super(),this.registerFactory('markerFactory',markerFactory),this._getFirstValidData=function(a,b){let c,d=a.length;for(c=0;c<d;c++)if(a[0]&&a[0][b]!==void 0)return a[0][b]},this.config.hoverInfo=[]}getHoverInConfig(a){let b=this.config;return{style:b.hoverInStyle,index:a,hovered:!0}}getHighlightConfig(a){let b=this.config;return{style:b.highlightStyle,index:a,hovered:!1}}getHoverOutConfig(a){let b=this.config;return{style:b.hoverOutStyle,index:a,hovered:!1}}getType(){return'dataset'}getName(){return'timeseriesColumn'}__setDefaultConfig(){super.__setDefaultConfig();let a=this,b=a.config;b['default-plotSpacePercent']=30,b.visibility='visible',b.prevBoundaryInfo={},b.prevDataInfo=[],b.dataMarkerPadding=0,b.style={},b.hoverInStyle={},b.highlightStyle={},b.hoverOutStyle={},b.defaultStyle={"stroke-width":1,"fill-opacity":1,"stroke-opacity":1,opacity:1},b.defaultHoverInStyle={opacity:.8}}configureAttributes(a){let b,c=this,d=c.getFromEnv('chart-attrib'),e=c.config;if(a.hasOwnProperty('index'))e.hoverInfo.push(a),e.hoverMode=!0;else{for(b in a)if('primaryColor'===b){let d,f=a.plotCosmetics,g=a.genericCosmetics,h=a[b],i=c.getFromEnv('getStyleDef'),j=i(g.style&&g.style.plot),k=i(g.style&&g.style['plot:hover']),l=i(g.style&&g.style['plot:highlight']),m=i(f.style&&f.style.plot),n=i(a.styleConfig&&a.styleConfig.plot),o=i(f.style&&f.style.column),p=i(a.styleConfig&&a.styleConfig.column),q=i(f.style&&f.style['plot:hover']),r=i(f.style&&f.style['plot:highlight']),s=i(a.styleConfig&&a.styleConfig['plot:hover']),t=i(a.styleConfig&&a.styleConfig['plot:highlight']),u=i(f.style&&f.style['column:hover']),v=i(f.style&&f.style['column:highlight']),w=i(a.styleConfig&&a.styleConfig['column:hover']),x=i(a.styleConfig&&a.styleConfig['column:highlight']),y=e.style,z=e.hoverOutStyle,A=e.hoverInStyle,B=e.highlightStyle;for(d in[y,e.defaultStyle,j,m,n,o,p].reduce(_reducerFn),[A,e.defaultHoverInStyle,k,q,u,s,w].reduce(_reducerFn),[B,l,r,v,t,x].reduce(_reducerFn),Object.keys(B).length||(B=e.highlightStyle=extend2({},A)),y.stroke=convertColor(pluck(y.stroke,h,e['default-stroke']),100*pluckNumber(y['stroke-opacity'],1)),y.fill=convertColor(pluck(h,y.stroke,e['default-fill']),100*pluckNumber(y['fill-opacity'],1)),A.fill&&(A.fill=convertColor(A.fill,100*pluckNumber(A['fill-opacity'],y['fill-opacity']))),A.stroke&&(A.stroke=convertColor(A.stroke,100*pluckNumber(A['stroke-opacity'],y['stroke-opacity']))),B.fill&&(B.fill=convertColor(B.fill,100*pluckNumber(B['fill-opacity'],y['fill-opacity']))),B.stroke&&(B.stroke=convertColor(B.stroke,100*pluckNumber(B['stroke-opacity'],y['stroke-opacity']))),Object.assign(Object.assign({},A),B))z[d]=pluck(y[d],'');defined(z['stroke-dasharray'])&&(z['stroke-dasharray']=''),e.plotBorderThickness=y['stroke-width'],e.opacity=y.opacity,e['fill-opacity']=y['fill-opacity'],e['stroke-opacity']=y['stroke-opacity'],delete y.opacity,delete y['fill-opacity'],delete y['stroke-opacity']}else e[b]=a[b];if(e.plotSpacePercent=pluckNumber(d.plotspacepercent,e['default-plotSpacePercent']),!e.skipLimitCalc){e.limit=c._calculateLimits();const a=c.getFromEnv('chart');a.setYScaleLimit(e.scaleY.getId(),c.getId(),e.limit.y,e.limit.baseRequired),a.setXScaleLimit(e.scaleX.getId(),c.getId(),e.limit.x)}}}getValueFromPx(a){let b=this.getFromEnv('binDecider').getBinRange(),c=b[1]-b[0],d=this.getFromEnv('chart').getFocusLimit(),e=d[1]-d[0];return a*e/(c-a)}getPadding(){let a=this,b=a.config,c=b.scaleX,d=this.getFromEnv('binDecider').getRangeThreshold(),e=0,f=a.getValueFromPx(b.dataMarkerPadding);return c.showPlotOverTick()&&(e=d[2]/2),Math.max(e,f)}_calculateLimits(){let a,{indices:b,data:c,type:d,scaleY:e,scaleX:f}=this.config,g=/continuous/.test(this.getName()),h=f.showPlotOverTick(),i={},j=c[0],k=c[c.length-1],l='log'===e.getType(),m='visible'===this.config.visibility,n=this.getFromEnv('chart'),o=n.getFocusLimit();return a=this.getPadding(),i.x=h?m?[j&&j[b[0]].start-a,k&&k[b[0]].start+a]:UNDEF:g?m?[j&&(j[b[0]].start+j[b[0]].end)/2-a,k&&(k[b[0]].start+k[b[0]].end)/2+a]:UNDEF:m?[j&&j[b[0]].start-a,k&&k[b[0]].end-a]:UNDEF,i.y=m?[safeMin(c,a=>{let c=pluckNumber(a[b[2]],a[b[1]]),d=getDataPos(a[0]),e=isDataInvalid(l,c,d,o);return e?null:c}),safeMax(c,a=>{let c=a[b[1]],d=getDataPos(a[0]),e=isDataInvalid(l,c,d,o);return e?null:c})]:UNDEF,i.baseRequired=!/line/.test(d),i}draw(){let a=this;a._createContainer(),a._drawPlot(),a.config.hoverInfo=[],a.config.hoverMode=!1,a.config.repositioningDone=!1}legendInteractivity(){'visible'===this.config.visibility?this.hide():this.show()}_createContainer(){let a=this;a.addGraphicalElement({el:'group',container:{id:'meso',label:'group',isParent:!0},component:a,label:'group',id:'meso',attr:{name:'dataset-meso'}},!0),a.addGraphicalElement({el:'group',container:{id:'thermo',label:'group',isParent:!0},component:a,label:'group',id:'thermo',attr:{name:'dataset-thermo',"clip-path":a.getFromEnv('dsGroupclipPath')}},!0)}isDrawingRequired(){let a=this,b=a.config;if(b.repositioningDone||b.hoverMode)return!0}_drawPlot(){var a,b=this,c=b.config,d=c.style,e=defined(c.opacity),f=defined(c['stroke-opacity']),g=defined(c['fill-opacity']),h=c.dataInfo;b.addGraphicalElement({el:'group',container:{id:'meso',label:'group'},component:b,label:'group',id:'meso-plot',attr:Object.assign({name:'column-plot-meso',visibility:c.visibility},d)},!0),h.forEach((d,i)=>{isValidNumber(d.value)&&(a={x:d.x,y:d.y,width:d.width,height:d.height},e&&(a.opacity=c.opacity),f&&(a['stroke-opacity']=c['stroke-opacity']),g&&(a['fill-opacity']=c['fill-opacity']),d.style&&Object.assign(a,d.style),b.addGraphicalElement({el:'rect',container:{label:'group',id:'meso-plot'},props:{dataLength:h.length},label:'rect',attr:a,component:b,index:i},!0),d.style=void 0)}),c.hoverInfo=[]}_isRepositioningNeeded(){let a,b=this,c=b.config,d=b.getFromEnv('xScale'),e=b.getFromEnv('yScale'),[f,g]=d.getDomain(),[h,i]=d.getRange(),[j,k]=e.getDomain(),[l,m]=e.getRange(),n=c.prevBoundaryInfo,o=c.limit.y||[],p=c.prevDataInfo;return(+f!=+n.xDomainStart||+g!=+n.xDomainEnd||+j!=+n.yDomainStart||+k!=+n.yDomainEnd||h!==n.xRangeStart||i!==+n.xRangeEnd||l!==n.yRangeStart||m!==+n.yRangeEnd||c.prevVisibility!==c.visibility||o[0]!==p[0]||o[1]!==p[1]||c.legendInteracted)&&(c.legendInteracted=!1,a=!0,c.prevBoundaryInfo={xDomainStart:f,xDomainEnd:g,xRangeStart:h,xRangeEnd:i,yDomainStart:j,yDomainEnd:k,yRangeStart:l,yRangeEnd:m},c.prevVisibility=c.visibility,c.prevDataInfo=o),a}allocatePosition(){var a=Math.max;let b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v=this,w=v.config,[z,A,B,C]=w.indices,D=v.getFromEnv('binDecider'),E=v.getFromEnv('xScale'),F=v.getFromEnv('yScale'),G=w.dataInfo,H=w.groupIndex||0,I=w.totalGroups||1,J=w.data,K=w.plotBorderThickness,L=w.fillColor===w.strokeColor&&0<K,M=D.getRangeThreshold()[2],[N,O]=E.getDomain();if(w.repositioningDone=v._isRepositioningNeeded()){if('visible'!==w.visibility)return;G=w.dataInfo=[],w.availableWidth=q=E.getRangeValue(M)-E.getRangeValue(0),w.timeStampGap=M,o=a(q*(1-w.plotSpacePercent/100),1),c=o/I,r=Math.round(I/2),s=0==I%2?0:.5,n=0<r-H?-c*(r-H-s):c*(H-r+s),t=+E.getDomainValue(q*(w.plotSpacePercent/200))-+E.getDomainValue(0),w.actualStartDomain=+N+t,w.actualEndDomain=+O-t,L&&(c=a(c-K,1)),J.forEach((k,o)=>{d=k[z],e=k[A],o||(p=w.firstTimeStamp=d.start),h=k[B],j=F.getRangeValue(h||a(F.getDomain()[0],0)),i=F.getRangeValue(e),isValidNumber(e)&&isValidNumber(j)&&isValidNumber(i)&&(f=E.getRangeValue(new Date(d.start),new Date(d.end)),L&&(f+=K/2),f+=n,b=Math.abs(j-i),l=i>j,g=l?j:i,u={startDate:d.start,endDate:d.end,value:e,yBaseValue:h,yBase:j,x:f,y:g,width:c,height:b,totalStackSum:defined(k[C])?k[C]:UNDEF,eventArgs:{index:o,dataValue:e}},m=E.getBinIndex(d.start,p),G[m]=u)})}(k=w.hoverInfo)&&k.forEach(a=>{'object'==typeof G[a.index]&&'object'==typeof a.style&&(G[a.index].style=extend2(G[a.index].style,a.style))})}_getRelevantInfo(){var a=this.config;return{firstTimeStamp:a.firstTimeStamp,timeStampGap:a.timeStampGap,dataInfo:a.dataInfo,fill:a.style.stroke}}_getHoveredPlot(a,b){var c,d,e,f,g,h,i=this,j=i.getFromEnv('xScale'),k=i.getLinkedParent(),l=i.config,m=i.getChildren('flagMarker'),n=k.getTranslation(),o=n?n.x:0,p=n?n.y:0;if(defined(l.firstTimeStamp))return a-=o,b-=p,c=j.getDomainValue(a).getTime(),h=(c-l.firstTimeStamp)/l.timeStampGap,1>=l.timeStampGap&&-1===h&&(h=0),d=Math.ceil(h),e=Math.floor(h),m&&(m=m[0])&&(f=m._checkPointOverMarker(h,a,b,l.availableWidth)),g=f,g||(g=i._checkPointerOverColumn(d,a,b)),g.hovered||(g=i._checkPointerOverColumn(e,a,b)),g.hovered?g.binIndexHovered=g.pointIndex:(g.binIndexHovered=j.getBinIndex(j.getDomainValue(a),l.firstTimeStamp),g.pointObj=l.dataInfo[g.binIndexHovered]||j.getBinBounds(a,l.firstTimeStamp)),l.binIndexHovered=g.binIndexHovered,g}_getHoveredBin(){return this.config.binIndexHovered}_getTooltext(a,b,c){var d,e,f=this,g=f.config,h=f.getName(),i=getGenericType(g.type),j=f.getFromEnv('tooltipStyle').body,k=f.getFromEnv('tooltipStyle').container['line-height']||1,l=1===k?j['font-size']:k,m=g.dataInfo,n=m[c],o=a?b?1:.5:1,p='continuous'===h?'line'===i?g.plotStyle.stroke:g.plotStyle.fill:g.style.fill;return f._isInvalidTooltext(n)?'':(n.tooltipValue||(d=isValidNumber(n.yBaseValue)?0<=n.yBaseValue?n.value-n.yBaseValue:n.yBaseValue-n.value:n.value,n.tooltipValue=isValidNumber(d)?g.formatterFn({value:d,type:'tooltip',prefix:g.prefix,suffix:g.suffix}):''),e=`<div style='margin-top:6px; overflow: hidden; opacity:${o}'>
      <span style='float:left; height: ${l}; width: ${l}; position:relative;margin-right: 2px;'>
        <span style='display:block;height:64%;width:64%;position:absolute;top:50%;transform:translateY(-50%);background-color:${p};'></span>
      </span>
      <div style='float:left;'>${g.series}&nbsp</div>
      <div style='float: right;'>&nbsp${n.tooltipValue||''}</div>
      </div>`,e)}_isInvalidTooltext(a){let b=this,c=b.config;if(!a||a.endDate<c.actualStartDomain||a.startDate>c.actualEndDomain)return!0}_getDateForToolText(a){var b=this,c=b.config,d=c.dataInfo,e='',f='',g=d[a];return b._isInvalidTooltext(g)?{body:'',header:''}:(g.tooltextTime||(g.tooltextTime=c.timeFormatterFn({type:'tooltip',dateRange:g})),!g.totalStackSumTooltip&&isValidNumber(g.totalStackSum)&&(g.totalStackSumTooltip=c.formatterFn({value:g.totalStackSum,type:'tooltip',prefix:c.prefix,suffix:c.suffix})),e=`<div style='margin-bottom:8px;'>${g.tooltextTime}</div>`,g.totalStackSumTooltip&&(f=`<div style='margin-bottom: 2px;'>Total: ${g.totalStackSumTooltip}</div>`),{header:e,body:f})}_checkPointerOverColumn(a,b,c){var d,e,f,g,h,i,j,k,l=this,m=l.config,n=m.plotBorderThickness,o=m.dataInfo;return(d=o[a],!d)?{pointIndex:a,hovered:!1,component:l}:(h=d.height<HTP?HTP:d.height,g=d.width<HTP?HTP:d.width,k=d.height<HTP?d.y-(HTP-d.height):d.y,void 0===n?n=j=0:j=n/2,e=b-d.x+j,f=c-k+j,i=0<=e&&e<=g+n&&0<=f&&f<=h+n,{pointIndex:a,hovered:i,pointObj:d,component:l})}_firePlotEvent(a,b,c){let d,e,f=this,g=f.config.dataInfo,h=g[b]&&g[b].eventArgs||{},i=f.getFromEnv('chart'),j=getMouseCoordinate(i.getFromEnv('chart-container'),c,i),k=extend2(j,h);'fc-mouseover'===a?i.fireChartInstanceEvent(ROLLOVER,k,UNDEF,UNDEF,function(){c.FusionChartsPreventEvent=!0}):'fc-mouseout'===a?i.fireChartInstanceEvent(ROLLOUT,k):'fc-click'===a||'touchend'===a||'mouseup'===a?(i.fireChartInstanceEvent(CLICK,k),d=i.getFromEnv(),e=d&&d.linkClickFN,k.link&&e&&e.call({link:k.link},!0)):void 0}setHoverInEffect(a,b){this.getFromEnv('animationManager').setAnimationState('mouseOver'),this.setData(b?this.getHoverInConfig(a):this.getHighlightConfig(a),!0)}setHoverOutEffect(a){this.getFromEnv('animationManager').setAnimationState('mouseOut'),this.setData(this.getHoverOutConfig(a),!0)}show(){this.setData({visibility:'visible'},!0)}hide(){this.setData({visibility:'hidden'},!0)}remove(){const a=this.getFromEnv('chart'),b=this.config;a.setYScaleLimit(b.scaleY.getId(),this.getId()),a.setXScaleLimit(b.scaleX.getId(),this.getId()),super.remove()}}export default Column;