@fusioncharts/widgets/src/dataset/bulb/index.js

FusionCharts JavaScript charting framework

"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule=true;exports.default=void 0;var _inheritsLoose2=_interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _lib=require("@fusioncharts/core/src/lib");var _componentInterface=require("@fusioncharts/core/src/component-interface");var _dependencyManager=require("@fusioncharts/core/src/dependency-manager");var _index=_interopRequireDefault(require("./index.animation"));var UNDEF,BLANKSTRING=_lib.BLANK,POSITION_TOP=_lib.preDefStr.POSITION_TOP,POSITION_MIDDLE=_lib.preDefStr.POSITION_MIDDLE,showHoverEffectStr=_lib.preDefStr.showHoverEffectStr,visibleStr=_lib.preDefStr.visibleStr,ROUND=_lib.preDefStr.ROUND,ROLLOVER="DataPlotRollOver",ROLLOUT="DataPlotRollOut",FILLMIXDARK10="{dark-10}",EVENTARGS="eventArgs",SETROLLOVERATTR="setRolloverAttr",SETROLLOUTATTR="setRolloutAttr",POINTER="pointer",EASE_OUT="easeOut",math=Math,mathMin=math.min,win=window,userAgent=win.navigator.userAgent,isIE=/msie/i.test(userAgent)&&!win.opera,TRACKER_FILL="rgba(192,192,192,"+(isIE?.002:1e-6)+")",createGroup=function createGroup(groupName,parentContainer,dataset){var animationManager=dataset.getFromEnv("animationManager");return animationManager.setAnimation({el:"group",attr:{name:groupName},container:parentContainer,component:dataset,label:"group"})};(0,_dependencyManager.addDep)({name:"bulbAnimation",type:"animationRule",extension:_index.default});var BulbDataset=function(_ComponentInterface){function BulbDataset(){var _this;_this=_ComponentInterface.call(this)||this;_this.addData=function(){};_this.removeData=function(){};_this.components={};return _this}(0,_inheritsLoose2.default)(BulbDataset,_ComponentInterface);var _proto=BulbDataset.prototype;_proto.getType=function getType(){return"dataset"};_proto.getName=function getName(){return"bulb"};_proto._manageSpace=function _manageSpace(availableHeight){var dataSet=this,conf=dataSet.config,dataStore=dataSet.components.data,dataObj,chart=dataSet.getFromEnv("chart"),chartConfig=chart.config,smartLabel=dataSet.getFromEnv("smartLabel"),smartDataLabel,style=chartConfig.dataLabelStyle,lineHeight=(0,_lib.pluckNumber)(parseInt(style.lineHeight,10),12),maxAllowedHeight=availableHeight,valuePadding=chartConfig.valuepadding,heightUsed=0,config;dataObj=dataStore[0];config=dataObj&&dataObj.config;smartLabel.useEllipsesOnOverflow(chartConfig.useEllipsesWhenOverflow);smartLabel.setStyle(style);if(config&&config.displayValue!==BLANKSTRING&&!chartConfig.placevaluesinside){if(conf.showValue){smartDataLabel=smartLabel.getOriSize(config.displayValue);if(config.displayValue===_lib.BLANK){smartDataLabel={height:lineHeight}}if(smartDataLabel.height>0){heightUsed=smartDataLabel.height+valuePadding}if(heightUsed>maxAllowedHeight){heightUsed=maxAllowedHeight}}}conf.heightUsed=heightUsed;return{top:0,bottom:heightUsed}};_proto.configureAttributes=function configureAttributes(datasetJSON){if(!datasetJSON){return false}this.config.JSONData=datasetJSON;var dataSet=this,JSONData=dataSet.config.JSONData,userConfig=(0,_lib.extend2)({},JSONData),chart=dataSet.getFromEnv("chart"),conf=dataSet.config,chartConfig=chart.config,chartAttr=chart.getFromEnv("dataSource").chart,enableAnimation;(0,_lib.parseConfiguration)(userConfig,conf,chart.config,{data:true});conf.origW=(0,_lib.pluckNumber)(chartAttr.origw,chartConfig.autoscale?chart.config.origRenderWidth:chartConfig.width||chart.config.origRenderWidth);conf.origH=(0,_lib.pluckNumber)(chartAttr.origh,chartConfig.autoscale?chart.config.origRenderHeight:chartConfig.height||chart.config.origRenderHeight);conf.setToolText=(0,_lib.getValidValue)((0,_lib.parseUnsafeString)((0,_lib.pluck)(chartAttr.plottooltext,UNDEF),false));conf.useColorNameAsValue=(0,_lib.pluckNumber)(chartAttr.usecolornameasvalue,0);conf.showTextOutline=(0,_lib.pluckNumber)(chartAttr.textoutline,0);conf.enableAnimation=enableAnimation=(0,_lib.pluckNumber)(chartAttr.animation,chartAttr.defaultanimation,1);conf.animation=!enableAnimation?false:{duration:(0,_lib.pluckNumber)(chartAttr.animationduration,1)*1e3};conf.showValue=(0,_lib.pluckNumber)(chartAttr.showvalue,1);dataSet._setConfigure()};_proto._setConfigure=function _setConfigure(newDataset){var dataSet=this,chart=dataSet.getFromEnv("chart"),conf=dataSet.config,chartConfig=chart.config,JSONData=dataSet.config.JSONData,setDataArr=newDataset||JSONData.data,setDataLen=setDataArr&&setDataArr.length,len=newDataset&&newDataset.data.length||setDataLen,jsonData=chart.getFromEnv("dataSource"),chartAttr=jsonData.chart,colorM=dataSet.getFromEnv("color-manager"),showTooltip=(0,_lib.pluckNumber)(chartAttr.showtooltip,1),tooltipSepChar=(0,_lib.parseUnsafeString)((0,_lib.pluck)(chartAttr.tooltipsepchar,_lib.COMMASPACE)),formatedVal,toolText,showHoverEffect=chartConfig.showhovereffect,dataStore=dataSet.components.data,setData,setValue,dataObj,config,label,setDisplayValue,is3D=(0,_lib.pluckNumber)(chartAttr.is3d,1),i,numberFormatter=dataSet.getFromEnv("number-formatter"),colorRangeGetter,colorCodeObj,gaugeFillAlpha,colorName,gaugeBorderColorCode,gaugeBorderAlpha,hasGaugeBorderMix,fillColor,gaugeBorderColor,gaugeBorderThickness,gaugeFillHoverColor,gaugeFillHoverAlpha,showGaugeBorderOnHover,gaugeBorderHoverColor,gaugeBorderHoverAlpha,gaugeBorderHoverThickness,is3DOnHover,hasHoberFillMix,hasBorderHoverMix,displayValue,getPointColor=function getPointColor(color,alpha,isBulb3D){if(!isBulb3D){return(0,_lib.convertColor)(color,alpha)}return{FCcolor:{cx:.4,cy:.4,r:"80%",color:(0,_lib.getLightColor)(color,65)+_lib.COMMASTRING+(0,_lib.getLightColor)(color,75)+_lib.COMMASTRING+(0,_lib.getDarkColor)(color,65),alpha:alpha+_lib.COMMASTRING+alpha+_lib.COMMASTRING+alpha,ratio:"0,30,70",radialGradient:true}}},hoverAttr,hoverAnimAttr,outAttr;if(!dataStore){dataStore=dataSet.components.data=[]}for(i=0;i<len;i++){if(newDataset){setData=newDataset&&newDataset.data[i]}else{setData=setDataArr[i]}dataObj=dataStore[i];config=dataObj&&dataObj.config;if(!dataObj){dataObj=dataStore[i]={}}if(!dataObj.config){config=dataStore[i].config={}}config.setValue=setValue=numberFormatter.getCleanValue(setData.value)||0;formatedVal=numberFormatter.dataLabels(setValue);setDisplayValue=(0,_lib.getValidValue)((0,_lib.parseUnsafeString)(setData.displayvalue));config.colorRangeGetter=colorRangeGetter=dataSet.getFromEnv("colorRange");colorCodeObj=colorRangeGetter.getColorObj(config.setValue);if(!colorRangeGetter.colorArr.length){colorCodeObj=colorRangeGetter.config.defaultObj}gaugeFillAlpha=(0,_lib.pluckNumber)(chartAttr.gaugefillalpha,colorCodeObj.alpha,100);colorName=(0,_lib.parseUnsafeString)((0,_lib.pluck)(colorCodeObj.label,colorCodeObj.name));gaugeBorderColorCode=(0,_lib.pluck)(colorCodeObj.bordercolor,chartAttr.gaugebordercolor,(0,_lib.getDarkColor)(colorCodeObj.code,70),"000000");gaugeBorderAlpha=(0,_lib.pluckNumber)(colorCodeObj.borderalpha,chartAttr.gaugeborderalpha,"90")*gaugeFillAlpha/100;hasGaugeBorderMix=/\{/.test(gaugeBorderColorCode);gaugeBorderColorCode=hasGaugeBorderMix?colorM.parseColorMix((0,_lib.pluck)(colorCodeObj.bordercolor,colorCodeObj.code),gaugeBorderColorCode)[0]:gaugeBorderColorCode;config.gaugeBorderColor=gaugeBorderColor=(0,_lib.convertColor)(gaugeBorderColorCode,gaugeBorderAlpha);config.gaugeBorderThickness=gaugeBorderThickness=chartConfig.showgaugeborder?(0,_lib.pluckNumber)(chartAttr.gaugeborderthickness,1):0;config.rawFillColor=colorCodeObj.code;config.fillColor=fillColor=getPointColor(colorCodeObj.code,gaugeFillAlpha,is3D);if(showHoverEffect!==0&&(showHoverEffect||chartAttr.gaugefillhovercolor||chartAttr.plotfillhovercolor||chartAttr.gaugefillhoveralpha||chartAttr.plotfillhoveralpha||chartAttr.gaugefillhoveralpha===0||chartAttr.is3donhover||chartAttr.is3donhover===0||chartAttr.showgaugeborderonhover||chartAttr.showgaugeborderonhover===0||chartAttr.gaugeborderhovercolor||chartAttr.gaugeborderhoveralpha||chartAttr.gaugeborderhoveralpha===0||chartAttr.gaugeborderhoverthickness||chartAttr.gaugeborderhoverthickness===0)){showHoverEffect=true;gaugeFillHoverColor=(0,_lib.pluck)(chartAttr.gaugefillhovercolor,chartAttr.plotfillhovercolor,FILLMIXDARK10);gaugeFillHoverAlpha=(0,_lib.pluckNumber)(chartAttr.gaugefillhoveralpha,chartAttr.plotfillhoveralpha);showGaugeBorderOnHover=(0,_lib.pluckNumber)(chartAttr.showgaugeborderonhover);if(showGaugeBorderOnHover===UNDEF){if(chartAttr.gaugeborderhovercolor||chartAttr.gaugeborderhoveralpha||chartAttr.gaugeborderhoveralpha===0||chartAttr.gaugeborderhoverthickness||chartAttr.gaugeborderhoverthickness===0){showGaugeBorderOnHover=1}else{showGaugeBorderOnHover=chartConfig.showgaugeborder}}gaugeBorderHoverColor=(0,_lib.pluck)(chartAttr.gaugeborderhovercolor,FILLMIXDARK10);gaugeBorderHoverAlpha=(0,_lib.pluckNumber)(chartAttr.gaugeborderhoveralpha);gaugeBorderHoverThickness=showGaugeBorderOnHover?(0,_lib.pluckNumber)(chartAttr.gaugeborderhoverthickness,gaugeBorderThickness||1):0;is3DOnHover=!!(0,_lib.pluckNumber)(chartAttr.is3donhover,is3D);hoverAttr={};outAttr={};if(gaugeBorderThickness!==gaugeBorderHoverThickness){hoverAttr["stroke-width"]=gaugeBorderHoverThickness;outAttr["stroke-width"]=gaugeBorderThickness}outAttr.fill=(0,_lib.toRaphaelColor)(fillColor);hasHoberFillMix=/\{/.test(gaugeFillHoverColor);gaugeFillHoverColor=hasHoberFillMix?colorM.parseColorMix(colorCodeObj.code,gaugeFillHoverColor)[0]:(0,_lib.pluck)(gaugeFillHoverColor,colorCodeObj.code);hoverAttr.fill=(0,_lib.toRaphaelColor)(getPointColor(gaugeFillHoverColor,(0,_lib.pluckNumber)(gaugeFillHoverAlpha,gaugeFillAlpha),is3DOnHover));if(gaugeBorderHoverThickness){outAttr.stroke=gaugeBorderColor;hasBorderHoverMix=/\{/.test(gaugeBorderHoverColor);hoverAttr.stroke=(0,_lib.convertColor)(hasBorderHoverMix?colorM.parseColorMix(hasGaugeBorderMix?gaugeFillHoverColor:gaugeBorderColorCode,gaugeBorderHoverColor)[0]:gaugeBorderHoverColor,(0,_lib.pluckNumber)(gaugeBorderHoverAlpha,gaugeBorderAlpha))}}config.setTooltext=(0,_lib.getValidValue)((0,_lib.parseUnsafeString)((0,_lib.pluck)(setData.tooltext,JSONData.plottooltext,chartAttr.plottooltext),false));if(!showTooltip){toolText=false}else if(config.setTooltext!==UNDEF){toolText=(0,_lib.parseTooltext)(config.setTooltext,[1,2],{formattedValue:formatedVal},setData,chartAttr)}else{toolText=conf.useColorNameAsValue?colorName:formatedVal===null?false:label!==UNDEF?label+tooltipSepChar+formatedVal:formatedVal}if(setDisplayValue!==UNDEF){displayValue=setDisplayValue}else{displayValue=setData.label||(conf.useColorNameAsValue?colorName:formatedVal)}config.toolText=toolText;config.displayValue=displayValue;config.rolloverProperties={enabled:showHoverEffect,hoverAttr:hoverAttr,hoverAnimAttr:hoverAnimAttr,outAttr:outAttr}}};_proto.updateData=function updateData(dataObj,index,draw){var dataSet=this;dataSet._setConfigure(dataObj,index);if(draw){dataSet.asynDraw()}};_proto.draw=function draw(){var dataSet=this,dataStore=dataSet.components.data,chart=dataSet.getFromEnv("chart"),toolTipController=dataSet.getFromEnv("toolTipController"),conf=dataSet.config,animType=EASE_OUT,chartConfig=chart.config,canvasLeft=chartConfig.canvasLeft,canvasTop=chartConfig.canvasTop,canvasHeight=chartConfig.canvasHeight,canvasWidth=chartConfig.canvasWidth,parentContainer=chart.getChildContainer().plotGroup,container=dataSet.getContainer("container"),trackerContainer=dataSet.getContainer("trackerContainer"),trackerLayer=chart.getChildContainer("trackerGroup"),setValue,attr,toolText,tooltipVal,dataLabelObj,xPos,yPos,radius,bulb,bulbCheck,dataObj=dataStore[0],graphic,label,labelCheck,config=dataObj&&dataObj.config,gaugeOriginX=chartConfig.gaugeoriginx,gaugeOriginY=chartConfig.gaugeoriginy,gaugeRadius=chartConfig.gaugeradius,hasGaugeOriginX=chartConfig.hasgaugeoriginx,hasGaugeOriginY=chartConfig.hasgaugeoriginy,hasGaugeRadius=chartConfig.hasgaugeradius,labelY,vAlign,smartLabel=dataSet.getFromEnv("smartLabel"),animationManager=dataSet.getFromEnv("animationManager"),dataLabelContainer=dataSet.getContainer("dataLabelContainer"),style=chart.config.dataLabelStyle,dataLabelsLayer=chart.getChildContainer("datalabelsGroup"),trackerConfig;smartLabel.setStyle(style);if(!container){container=dataSet.addContainer("container",createGroup("bulb",parentContainer,dataSet))}if(!trackerContainer){trackerContainer=dataSet.addContainer("trackerContainer",createGroup("bulb-hot",trackerLayer,dataSet))}if(!dataLabelContainer){dataLabelContainer=dataSet.addContainer("dataLabelContainer",animationManager.setAnimation({el:"group",attr:{name:"datalabel"},label:"labelGroup",component:dataSet}))}if(dataLabelsLayer){dataLabelsLayer.appendChild(dataLabelContainer)}trackerConfig=dataObj.trackerConfig={};setValue=config.setValue;toolText=config.toolText;trackerConfig.eventArgs={value:setValue,displayValue:config.displayValue,toolText:!toolText?"":toolText,color:config.rawFillColor};if(!dataObj.graphics){dataObj.graphics={}}gaugeOriginX=hasGaugeOriginX!==UNDEF?gaugeOriginX*conf.scaleFactor:canvasLeft+canvasWidth/2;gaugeOriginY=hasGaugeOriginY!==UNDEF?gaugeOriginY*conf.scaleFactor:canvasTop+canvasHeight/2;xPos=gaugeOriginX;yPos=gaugeOriginY;radius=hasGaugeRadius!==UNDEF?gaugeRadius*conf.scaleFactor:mathMin(canvasWidth/2,canvasHeight/2);attr={cx:xPos,cy:yPos,r:radius,"stroke-linecap":ROUND,stroke:(0,_lib.toRaphaelColor)(config.gaugeBorderColor),"stroke-width":config.gaugeBorderThickness,fill:(0,_lib.toRaphaelColor)(config.fillColor)};bulbCheck=dataObj.graphics.element;bulb=animationManager.setAnimation({el:bulbCheck||"circle",attr:attr,container:container,component:dataSet,animType:animType,label:"circle"});if(!bulbCheck){dataObj.graphics.element=bulb}trackerConfig.attr={cx:xPos,cy:yPos,r:radius,cursor:config.setLink?POINTER:_lib.BLANK,stroke:TRACKER_FILL,"stroke-width":config.plotBorderThickness,fill:TRACKER_FILL,visibility:visibleStr};graphic=dataObj.graphics;labelCheck=graphic.label;if(!chartConfig.placevaluesinside){labelY=yPos+radius+chartConfig.valuepadding;vAlign=POSITION_TOP}else{labelY=yPos;vAlign=POSITION_MIDDLE}if(config.setValue!==BLANKSTRING&&conf.showValue){dataLabelObj=smartLabel.getSmartText(config.displayValue,chartConfig.width-chartConfig.chartleftmargin-chartConfig.chartrightmargin,+chartConfig.height-labelY-chartConfig.chartbottommargin);tooltipVal=dataLabelObj.tooltext||BLANKSTRING;attr={text:dataLabelObj.text,"text-anchor":POSITION_MIDDLE,x:gaugeOriginX,y:labelY,"vertical-align":vAlign,fill:style.color,direction:config.textDirection,"text-bound":[style.backgroundColor,style.borderColor,style.borderThickness,style.borderPadding,style.borderRadius,style.borderDash]};label=animationManager.setAnimation({el:labelCheck||"text",animType:animType,attr:attr,label:"text",container:dataLabelContainer,component:dataSet});label.outlineText(conf.showTextOutline,attr.fill);if(!labelCheck){graphic.label=label}if(chartConfig.showToolTip){toolTipController.enableToolTip(label,tooltipVal)}else{toolTipController.disableToolTip(label)}}conf.showValue?graphic.label&&graphic.label.show():graphic.label&&graphic.label.hide();dataSet.drawTracker()};_proto.drawTracker=function drawTracker(){var dataSet=this,chart=dataSet.getFromEnv("chart"),animationManager=dataSet.getFromEnv("animationManager"),toolTipController=dataSet.getFromEnv("toolTipController"),components=dataSet.components,dataStore=components.data,chartConfig=chart.config,showHoverEffect=chartConfig.plothovereffect,trackerContainer=dataSet.getContainer("trackerContainer"),trackerConfig,config,dataObj,setElement,hotElemCreated=false,hotElement,hotElementCheck,attr,clickFunc=function clickFunc(setDataArr){var ele=this;chart.plotEventHandler(ele,setDataArr)},rolloverResponseSetter=function rolloverResponseSetter(elem){return function(data){var ele=this,elData=ele.getData(),setRolloverAttr=elData.setRolloverAttr;if(elData.showHoverEffect!==0&&elData.draged!==true){if(setRolloverAttr.fill){animationManager.setAnimationState("mouseover");animationManager.setAnimation({el:elem,attr:setRolloverAttr,component:dataSet})}chart.plotEventHandler(ele,data,ROLLOVER)}}},rolloutResponseSetter=function rolloutResponseSetter(elem){return function(data){var ele=this,elData=ele.getData(),setRolloutAttr=elData.setRolloutAttr;if(elData.showHoverEffect!==0&&elData.draged!==true){if(setRolloutAttr.fill){animationManager.setAnimationState("mouseout");animationManager.setAnimation({el:elem,attr:setRolloutAttr,component:dataSet})}chart.plotEventHandler(ele,data,ROLLOUT)}}};dataObj=dataStore[0];config=dataObj&&dataObj.config;trackerConfig=dataObj.trackerConfig;setElement=dataObj.graphics.element;attr=trackerConfig.attr;hotElementCheck=dataObj.graphics.hotElement;if(attr){hotElement=animationManager.setAnimation({el:hotElementCheck||"circle",attr:attr,container:trackerContainer,component:dataSet,label:"tracker"});if(!hotElementCheck){dataObj.graphics.hotElement=hotElement;hotElemCreated=true}(hotElement||setElement).data(EVENTARGS,trackerConfig.eventArgs).data(showHoverEffectStr,showHoverEffect).data(SETROLLOVERATTR,config.rolloverProperties.hoverAttr||{}).data(SETROLLOUTATTR,config.rolloverProperties.outAttr||{});toolTipController.enableToolTip(hotElement||setElement,trackerConfig.eventArgs.toolText);if(hotElemCreated||config.elemCreated){(hotElement||setElement).on("fc-click",clickFunc).hover(rolloverResponseSetter(setElement),rolloutResponseSetter(setElement))}}};return BulbDataset}(_componentInterface.ComponentInterface);var _default=exports.default=BulbDataset;