@fusioncharts/widgets
Version:
FusionCharts JavaScript charting framework
1 lines • 14.5 kB
JavaScript
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule=true;exports.default=void 0;var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _inheritsLoose2=_interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _componentInterface=require("@fusioncharts/core/src/component-interface");var _lib=require("@fusioncharts/core/src/lib");var _animationManager=_interopRequireDefault(require("@fusioncharts/core/src/animation-manager"));var _index=require("@fusioncharts/core/src/dependency-manager/index");var _polarUtil=require("@fusioncharts/utils/src/scale-utils/polar-util");function ownKeys(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);r&&(o=o.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,o)}return t}function _objectSpread(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{};r%2?ownKeys(Object(t),!0).forEach((function(r){(0,_defineProperty2.default)(e,r,t[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):ownKeys(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))}))}return e}var M="M",A="A",L="L",Z="Z";function setPath(_startAngle,_endAngle,arc,outerRadius,innerRadius,centerX,centerY,thickness,startRadius,endRadius){if(startRadius>0&&arc!==360){_startAngle+=(0,_polarUtil.radiansInAngle)(startRadius,innerRadius+startRadius)}if(endRadius>0&&arc!==360){_endAngle-=(0,_polarUtil.radiansInAngle)(endRadius,innerRadius+endRadius)}var startAngle=(0,_polarUtil.normaliseAngle)(_startAngle),endAngle=(0,_polarUtil.normaliseAngle)(_endAngle),newArc=(0,_polarUtil.findArc)(startAngle,endAngle),_pointOnCircleFromCen=(0,_polarUtil.pointOnCircleFromCenter)(centerX,centerY,outerRadius,startAngle),x1=_pointOnCircleFromCen.x,y1=_pointOnCircleFromCen.y,_pointOnCircleFromCen2=(0,_polarUtil.pointOnCircleFromCenter)(centerX,centerY,outerRadius,endAngle),x2=_pointOnCircleFromCen2.x,y2=_pointOnCircleFromCen2.y,_pointOnCircleFromCen3=(0,_polarUtil.pointOnCircleFromCenter)(centerX,centerY,innerRadius,startAngle),x3=_pointOnCircleFromCen3.x,y3=_pointOnCircleFromCen3.y,_pointOnCircleFromCen4=(0,_polarUtil.pointOnCircleFromCenter)(centerX,centerY,innerRadius,endAngle),x4=_pointOnCircleFromCen4.x,y4=_pointOnCircleFromCen4.y;if(newArc>270)newArc=arc;x1=(0,_lib.toPrecision)(x1,4);y1=(0,_lib.toPrecision)(y1,4);x2=(0,_lib.toPrecision)(x2,4);y2=(0,_lib.toPrecision)(y2,4);x3=(0,_lib.toPrecision)(x3,4);y3=(0,_lib.toPrecision)(y3,4);x4=(0,_lib.toPrecision)(x4,4);y4=(0,_lib.toPrecision)(y4,4);return[M,x1,y1,A,outerRadius,outerRadius,0,newArc<=180?0:1,1,x2,y2,endRadius>0&&newArc!==360?A+", "+endRadius+", "+endRadius+", 0, 1, 1, "+x4+", "+y4:L+", "+x4+", "+y4,A,innerRadius,innerRadius,0,newArc<=180?0:1,0,x3,y3,startRadius>0&&newArc!==360?A+", "+startRadius+", "+startRadius+", 0, 1, 1, "+x1+", "+y1:"",Z]}var RadialBarPlot=function(_SmartRenderer){function RadialBarPlot(){return _SmartRenderer.apply(this,arguments)||this}(0,_inheritsLoose2.default)(RadialBarPlot,_SmartRenderer);var _proto=RadialBarPlot.prototype;_proto.getName=function getName(){return"RadialBarPlot"};_proto.getType=function getType(){return"plot"};RadialBarPlot.getName=function getName(){return"RadialBarPlot"};RadialBarPlot.getType=function getType(){return"plot"};_proto._mouseOverHandler=function _mouseOverHandler(e){var toolTipController=this.getFromEnv("toolTipController"),radialBar=this.getLinkedParent();if(radialBar.config.showcontextlabel){radialBar.drawContextLabel(this.getParsedText(this.config.contexttext,true),true)}if(radialBar.config.showtooltip&&!this.config.currentToolTip){this.config.currentToolTip=toolTipController.draw(e.originalEvent,this.getParsedText(this.config.tooltext,true))}this.config.realBarAlpha=this.config.realBarAlpha||this.config.baralpha;this.config.realBarBorderAlpha=this.config.realBarBorderAlpha||this.config.barborderalpha;this.setData({baralpha:.25*this.config.realBarAlpha,barborderalpha:.25*this.config.realBarBorderAlpha},true);if(e&&e.sender&&e.sender.config&&e.sender.config.lastElemUsed){var element=e.sender.config.lastElemUsed;radialBar.plotEventHandler(element,e,"dataplotRollover")}};_proto._mouseOutHandler=function _mouseOutHandler(e){var toolTipController=this.getFromEnv("toolTipController"),radialBar=this.getLinkedParent();if(this.config.currentToolTip){toolTipController.hide(this.config.currentToolTip);this.config.currentToolTip=_lib.UNDEF}this.setData({baralpha:this.config.realBarAlpha,barborderalpha:this.config.realBarBorderAlpha},true);if(radialBar.config.showcontextlabel){radialBar.drawContextLabel(radialBar.config.defaultcontextlabel)}if(e&&e.sender&&e.sender.config&&e.sender.config.lastElemUsed){var element=e.sender.config.lastElemUsed;radialBar.plotEventHandler(element,e,"dataplotRollout")}};_proto._mouseClickHandler=function _mouseClickHandler(e){var radialBar=this.getLinkedParent();if(e&&e.sender&&e.sender.config&&e.sender.config.lastElemUsed){var element=e.sender.config.lastElemUsed;radialBar.plotEventHandler(element,e,"dataplotClick")}};_proto.__setDefaultConfig=function __setDefaultConfig(){this.config.startangle=90;this.config.endangle=180;this.config.barstartradius="100%";this.config.barendradius="100%";this.config.barborder="none";this.config.barbordercolor="#000000";this.config.barborderalpha=1;this.config.barborderthickness=1;this.config.color="#0000ff";this.config.baralpha=1;this.config.value=0};_proto.configureAttributes=function configureAttributes(dataObj){_SmartRenderer.prototype.configureAttributes.call(this,dataObj);if(dataObj.value<=0)dataObj.value=0;this.config=_objectSpread(_objectSpread({},this.config),dataObj);if(!this.getFromEnv("chartConfig")){this.addToEnv("chartConfig",this.config)}this.createBaseComponent();if(dataObj.thickness){this.config.thickness=dataObj.thickness}if(dataObj.startangle||dataObj.startangle===0){this.config.startingAngle=dataObj.startangle}if(dataObj.endangle||dataObj.endangle===0){this.config.endingAngle=dataObj.endangle}if(this.config.barborder==="none"){this.config.barborderalpha=0;this.config.barborderthickness=0}this.getLinkedParent().config.showLegend&&this._addLegend()};_proto.createBaseComponent=function createBaseComponent(){var iapi=this,animationManager=iapi.getFromEnv("animationManager");if(!animationManager){animationManager=new _animationManager.default;iapi.addToEnv("animationManager",animationManager);animationManager.addToEnv("chart",iapi)}animationManager.configure();animationManager._setAnimDuration()};_proto.addPaperToEnv=function addPaperToEnv(){var container=this.getFromEnv("chart-container"),Raphael=(0,_index.getDep)("redraphael","plugin"),paper=new Raphael(container,this.getFromEnv("chartWidth"),this.getFromEnv("chartHeight"));paper.setHTMLClassName("fusioncharts-div");var animationManager=this.getFromEnv("animationManager");animationManager.addToEnv("paper",paper)};_proto.setNodePath=function setNodePath(box,thickness,config){this.config.thickness=thickness;this.config.outerRadius=box/2;this.config.innerRadius=this.config.outerRadius-this.config.thickness;this.config.barstartradius=config.barstartradius;this.config.barendradius=config.barendradius;this.manageSpace()};_proto.manageSpace=function manageSpace(){var chartConfig=this.getFromEnv("chartConfig"),radialBar=this.getLinkedParent(),canvasLeft=chartConfig.canvasLeft,canvasTop=chartConfig.canvasTop,availableWidth=chartConfig.canvasWidth,availableHeight=chartConfig.canvasHeight,centerX=canvasLeft+availableWidth/2,centerY=canvasTop+availableHeight/2,startAngle=(0,_polarUtil.changeAngleBase)(this.config.startingAngle),endingAngle=(0,_polarUtil.changeAngleBase)(this.config.endingAngle),trackArc=(0,_polarUtil.findArc)(startAngle,startAngle===endingAngle?endingAngle-.1:endingAngle),endAngle=startAngle+Math.round((this.config.value>100?100:this.config.value)/100*trackArc),arc,startRadius=parseInt(this.config.barstartradius,10)/100*(this.config.thickness/2),endRadius=parseInt(this.config.barendradius,10)/100*(this.config.thickness/2);endAngle=startAngle===endingAngle?endAngle-.01:endAngle;arc=(0,_polarUtil.findArc)(startAngle,endAngle);this.getFromEnv("chart-attrib").interactivelegend=radialBar.config.interactivelegend;this.config.path_d=setPath(startAngle,endAngle,arc,this.config.outerRadius,this.config.innerRadius,centerX,centerY,this.config.thickness,startRadius,endRadius)};_proto.allocatePosition=function allocatePosition(){return false};_proto.checkInvalidData=function checkInvalidData(){return false};_proto.checkInvalidSpecificData=function checkInvalidSpecificData(){return false};_proto._addLegend=function _addLegend(){var legend=this.getFromEnv("legend"),legendItem=legend.getItem(this.config.legendItemId),radialBar=this.getLinkedParent(),config={label:this.config.label,type:"radialBar",showIcon:parseInt(radialBar.config.showiconinlegend,10)&&this.config.iconurl,iconUrl:this.config.iconurl};if(!legendItem){this.config.legendItemId=legend.createItem(this.getLinkedParent());legendItem=legend.getItem(this.config.legendItemId)}legendItem.configure(config);legendItem.setStateCosmetics("default",{symbol:{fill:this.config.realColor||this.config.color,stroke:this.config.barbordercolor,rawFillColor:this.config.realColor||this.config.color,rawStrokeColor:this.config.barbordercolor,bgColor:this.config.realColor||this.config.color,bgAlpha:(this.config.realBarAlpha||this.config.baralpha)*100,opacity:(this.config.realBarAlpha||this.config.baralpha)*100}});legendItem.setStateCosmetics("highlight",{symbol:{fill:this.config.legenditemcolor,stroke:this.config.legenditembordercolor,rawFillColor:this.config.legenditemcolor,rawStrokeColor:this.config.legenditembordercolor,bgColor:this.config.legenditemcolor,bgAlpha:25,opacity:25},text:{fill:(0,_lib.toRaphaelColor)({alpha:25})}});this.addExtEventListener("fc-click",(function(){legendItem.itemClickFn()}),legendItem)};_proto.getParsedText=function getParsedText(text,isIcon,textSize){var legend=this.getFromEnv("legend"),chartConfig=this.getFromEnv("chartConfig"),radialBar=this.getLinkedParent(),SMALLSQUARE="■",MEDIUMSQUARE="◼",uniChar=_lib.isIpad?SMALLSQUARE:MEDIUMSQUARE,pathArr,newPathArr=[],i,j,symbolBBox,legendItemSymbol,pathStart=[],finalPath=_lib.BLANKSTRING,legendItem=this.getLinkedParent().config.showLegend&&legend.getItem(this.config.legendItemId),graphicalElement=legendItem&&legendItem.getGraphicalElement(),transformText="",svgSize=textSize||this.config.labelFontSize,plotIdentifier,parseConfig,imageSize,svgScale,strokeWidth,iconSpacing;if(legendItem&&!chartConfig.showiconinlegend){legendItemSymbol=graphicalElement&&graphicalElement.legendItemSymbol;pathArr=legendItemSymbol&&legendItemSymbol.attrs.path.split(/(?=[LMCA])/);symbolBBox=legendItemSymbol&&legendItemSymbol.node.getBBox();svgSize=symbolBBox.height;strokeWidth=graphicalElement.legendItemSymbol.node.getAttribute("stroke-width");if(textSize&&textSize<symbolBBox.height){svgSize=textSize;svgScale=textSize/symbolBBox.height;strokeWidth=strokeWidth*svgScale/2;transformText="transform=scale("+svgScale+","+svgScale+")"}if(pathArr&&pathArr.length){for(i=0;i<pathArr.length;i++){pathStart.push(pathArr[i][0]);pathArr[i]=pathArr[i].substring(1,pathArr[i].length);if(i===pathArr.length-1){pathArr[i]=pathArr[i].substring(0,pathArr[i].length-1)}newPathArr[i]=pathArr[i].split(",")}}if(newPathArr&&newPathArr.length){for(i=0;i<newPathArr.length;i++){if(newPathArr[i].length){for(j=0;j<newPathArr[i].length;j++){newPathArr[i][j]=Number(newPathArr[i][j]);if(pathStart[i]!=="A"){if(j%2===0){newPathArr[i][j]=newPathArr[i][j]-symbolBBox.x}else{newPathArr[i][j]=newPathArr[i][j]-symbolBBox.y}}else if(pathStart[i]==="A"){if(j===5){newPathArr[i][j]=newPathArr[i][j]-symbolBBox.x}else if(j===6){newPathArr[i][j]=newPathArr[i][j]-symbolBBox.y}}}}finalPath+=pathStart[i]+newPathArr[i].toString()}}finalPath=finalPath+"Z"}plotIdentifier=legendItem&&finalPath?'<svg style="margin:0px 1px 0px 1px;" height= '+svgSize+" width = "+svgSize+" overflow='visible' xmlns=\"http://www.w3.org/2000/svg\">\n <path d= "+finalPath+" fill = "+(this.config.realColor||this.config.color)+" stroke = "+graphicalElement.legendItemSymbol.node.getAttribute("stroke")+"\n stroke-opacity = 1 fill-opacity = 1 "+transformText+"\n stroke-width = "+strokeWidth+" stroke-linecap = "+graphicalElement.legendItemSymbol.node.getAttribute("stroke-linecap")+"></path>\n </svg>":"<span style='color: "+(this.config.realColor||this.config.color)+";'>"+uniChar+" </span>";parseConfig={value:this.config.value,barColor:this.config.realColor||this.config.color,plotIdentifier:plotIdentifier};if(isIcon){if(this.config.iconurl){imageSize=svgSize*parseInt(radialBar.config.iconscale,10)/100;if(imageSize>=Math.abs(this.config.outerRadius-this.config.innerRadius)){imageSize=Math.abs(this.config.outerRadius-this.config.innerRadius)}imageSize=imageSize<0?Math.abs(this.config.outerRadius-this.config.innerRadius):imageSize;if(textSize){iconSpacing=radialBar.config.iconposition==="end"?"0px 0px 0px 10px":"0px 10px 0px 0px"}parseConfig.icon='<svg style="margin:'+iconSpacing+';" height= '+imageSize+" width = "+imageSize+' overflow=\'visible\' xmlns="http://www.w3.org/2000/svg">\n <image preserveAspectRatio="none" href='+this.config.iconurl+'\n x="0" y="0" width= '+imageSize+" height="+imageSize+"></image>\n </svg>"}else{parseConfig.icon=plotIdentifier}}return(0,_lib.parseTooltext)(text,[1,2,3,172,145,173],{label:this.config.label,formattedValue:this.config.dataValue},parseConfig)||this.config.label};_proto.draw=function draw(){var radialBar=this.getLinkedParent();this.addGraphicalElement({el:"path",attr:{path:this.config.path_d,fill:this.config.color,stroke:this.config.barbordercolor,"stroke-width":this.config.barborderthickness,"stroke-opacity":this.config.plotHidden?0:this.config.barborderalpha,"stroke-dasharray":this.config.barborder==="dashed"?5:_lib.UNDEF,"fill-opacity":this.config.plotHidden?0:this.config.baralpha},container:{id:"node-container",isParent:true},label:"bar",component:this});if(!this.config.plotHidden){radialBar.drawLabel(radialBar.getChildren("dataset")[this.config.plotIndex],this)}};return RadialBarPlot}(_componentInterface.SmartRenderer);var _default=exports.default=RadialBarPlot;