@froalacharts/charts
Version:
Froala Charts - A collection of interactive charts to build data visualizations for web and mobile applications.
1 lines • 12.5 kB
JavaScript
"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("@froalacharts/core/src/lib");var _componentInterface=require("@froalacharts/core/src/component-interface");var _dependencyManager=require("@froalacharts/core/src/dependency-manager");var _legendItem=_interopRequireDefault(require("./legend-item.animation"));var POINTER=_lib.preDefStr.POINTER,NONE="none",M="M",L="L",Z="Z",A="A",_getSymbolPath=function _getSymbolPath(x,y,w,h,seriesType){var path=[M],w1,w2,h1,h2,height3,cx1,cx2,cy1,cy2,d1,d2;switch(seriesType){case"column":case"dragColumn":case"column3D":case"realtimeColumn":case"errorBar2D":w1=w*.25;w2=w1*.5;h1=h*.7;h2=h*.4;path=path.concat([x,y+h,"l",0,-h1,w1,0,0,h1,"z","m",w1+w2,0,"l",0,-h,w1,0,0,h,"z","m",w1+w2,0,"l",0,-h2,w1,0,0,h2,"z"]);break;case"bar2D":case"bar3D":w1=w*.3;w2=w*.6;h1=h/4;h2=h1/2;path=path.concat([x,y,L,x+w2,y,x+w2,y+h1,x,y+h1,Z,M,x,y+h1+h2,L,x+w,y+h1+h2,x+w,y+h1+h2+h1,x,y+2*h1+h2,Z,M,x,y+2*(h1+h2),L,x+w1,y+2*(h1+h2),x+w1,y+h,x,y+h,Z]);break;case"area":case"area3d":case"areaspline":case"dragArea":case"realTimeArea":case"splinearea":w1=w*.3;w2=w*.6;h1=h*.6;h2=h*.2;height3=h*.8;path=path.concat([x,y+height3,L,x,y+h1,x+w1,y+h2,x+w2,y+h1,x+w,y+h2,x+w,y+height3,Z]);break;case"pie2D":case"pie3d":case"doughnut2D":case"doughnut3D":w1=w*.5;w2=w1*.9;d1=1;d2=1;cx1=x+w1+d1;cy1=y+w1-d1;cx2=x+w1-d2;cy2=y+w1+d2;path=path.concat([cx1,cy1,L,cx1,cy1-w2+d1,A,w2-d1,w2-d1,0,0,1,cx1+w2-d1,cy1,Z,M,cx2,cy2,L,cx2,cy2-w2,A,w2,w2,0,1,0,cx2+w2,cy2,Z]);break;case"boxandwhisker2d":path=path.concat([x,y,L,x+w,y,x+w,y+h,x,y+h,Z]);break;default:path=path.concat([x,y,L,x+w,y,x+w,y+h,x,y+h,Z])}return{path:path}},getAnchorProps=function getAnchorProps(legendItem,symbolStyle){var legendItemConfig=legendItem.config,legendConfig=legendItem.getLinkedParent().config,symbolWidth=legendConfig.symbolWidth,radius=symbolWidth*.5,itemX=(legendConfig.initialItemX||0)+legendItemConfig._legendX,itemY=(legendConfig.initialItemY||0)+legendItemConfig._legendY,cx=itemX+legendConfig.symbolPadding+radius,cy=itemY+(legendItemConfig._markerYGutter||0)+legendConfig.symbolPadding+radius,symbolStr=(0,_lib.mapSymbolName)(legendItemConfig.anchorSide),symbol=legendItemConfig.symbol=symbolStr&&symbolStr.split("_")||[],dip=symbol[0]==="spoke"?1:0;if(legendItemConfig.type==="line"||legendItemConfig.drawLine){radius*=.6}return{path:(0,_lib.polyPathToPath)([symbol[1]||2,cx,cy,radius,legendItemConfig.startAngle,legendItemConfig.spoke||dip]),cursor:symbolStyle.cursor||POINTER,stroke:symbolStyle.stroke,fill:symbolStyle.fill,"stroke-width":symbolStyle["stroke-width"]||.5}};(0,_dependencyManager.addDep)({name:"legendItemAnimation",type:"animationRule",extension:_legendItem["default"]});var LegendItem=function(_ComponentInterface){(0,_inheritsLoose2["default"])(LegendItem,_ComponentInterface);function LegendItem(){var _this;_this=_ComponentInterface.call(this)||this;_this._stateCosmetics={};_this._legendState=[];return _this}var _proto=LegendItem.prototype;_proto.getName=function getName(){return"legendItem"};_proto.parseLegendCosmetics=function parseLegendCosmetics(){var legendItem=this,legend=this.getLinkedParent(),legendStates=legend.getLegendState(),legendItemStates=legendItem.getLegendState(),legendCosmetic,itemCosmetic,allStates=["default"],finalCosmetics={},i;allStates=allStates.concat(legendStates,legendItemStates);for(i=0;i<allStates.length;i++){legendCosmetic=legend.getStateCosmetics(allStates[i]);itemCosmetic=legendItem.getStateCosmetics(allStates[i]);if(legendCosmetic){if(typeof legendCosmetic==="function"){finalCosmetics=legendCosmetic(finalCosmetics,legendItem)}else{(0,_lib.extend2)(finalCosmetics,legendCosmetic)}}if(itemCosmetic){if(typeof itemCosmetic==="function"){finalCosmetics=itemCosmetic(finalCosmetics,legendItem)}else{(0,_lib.extend2)(finalCosmetics,itemCosmetic)}}}return finalCosmetics};_proto.getType=function getType(){return"legendItem"};_proto.configure=function configure(configObj){var legendItem=this,config=legendItem.config,prop,value;for(prop in configObj){if(configObj.hasOwnProperty(prop)){if(typeof configObj[prop]!=="object"){config[prop]=configObj[prop]}else{var obj=config[prop]?config[prop]:{};for(value in configObj[prop]){obj[value]=configObj[prop][value]}config[prop]=obj}}}};_proto.itemClickFn=function itemClickFn(){var legendItem=this,chartAttr=legendItem.getFromEnv("chart-attrib"),interactivelegend=(0,_lib.pluckNumber)(chartAttr.interactivelegend,1),dataset=legendItem.getLinkedItem("owner");if(interactivelegend){dataset.legendInteractivity(legendItem)}};_proto.dispose=function dispose(){this.removeEventListener("fc-click",this.click);this.removeEventListener("fc-mouseover",this.mouseover);this._dispose()};_proto.getLegendState=function getLegendState(){return this._legendState};_proto.hasState=function hasState(state){var states=this.getLegendState(),i,len;for(i=0,len=states.length;i<len;i++){if(states[i]===state){return true}}return false};_proto.setLegendState=function setLegendState(state,pushAtEnd){if(!this.hasState(state)){if(pushAtEnd){this._legendState.push(state)}else{this._legendState.unshift(state)}}this.asyncDraw()};_proto.__setDefaultConfig=function __setDefaultConfig(){_ComponentInterface.prototype.__setDefaultConfig.call(this);this.config.eventArguments={}};_proto.removeLegendState=function removeLegendState(state){var i,len,notFound=1;if(state){for(i=0,len=this._legendState.length;i<len&¬Found;i++){if(state===this._legendState[i]){this._legendState.splice(i,1);notFound=0}}}else{this._legendState.length=0}this.asyncDraw()};_proto.removeStateCosmetics=function removeStateCosmetics(state){delete this._stateCosmetics[state]};_proto.setStateCosmetics=function setStateCosmetics(state,cosmetics){this._stateCosmetics[state]=cosmetics};_proto.getStateCosmetics=function getStateCosmetics(state){return this._stateCosmetics[state]};_proto.draw=function draw(){var legend=this.getLinkedParent(),chart=legend.getFromEnv("chart"),chartConfig=chart.config,legendItem=this,animationManager=legendItem.getFromEnv("animationManager"),legendItemConfig=legendItem.config,config=legend.config,symbolBoxW=config.legendHeight,symbolPadding=config.symbolPadding,symbolWidth=config.symbolWidth,interactiveLegend=config.interactiveLegend,textPadding=config.textPadding||2,itemStyle,itemHoverStyle=config.itemHoverStyle,lineWidth,itemGroup=legend.getChildContainer("itemGroup"),drawCustomLegendIcon=config.drawCustomLegendIcon,hidden=legendItem.hasState("hidden"),customLegendConfig,initialItemX,initialItemY,cy,legendItemText,legendItemTextCheck,type,itemX,itemY,legendItemLine,symbolConfig,legendItemSymbol,legendItemSymbolCheck,cx,radius,dip,symbol,strokeColor,fillColor,bgFill,anchorSide,drawLine,symbolStr,customBgColor,customBgAlpha,customBorderColor,customBorderAlpha,fillcolor,strokecolor,legendItemBackground,legendItemBackgroundCheck,textCosmetics,drawItemLine,symbolAttr,backgroundAttr,backgroundCosmetics,lineAttr,lineCosmetics={},xPos,yPos;itemStyle=legendItem.parseLegendCosmetics();customLegendConfig=itemStyle.symbol;initialItemX=config.initialItemX||0;initialItemY=config.initialItemY||0;type=legendItemConfig.type;strokeColor=itemStyle.symbol.stroke||"000000";fillColor=itemStyle.symbol.fill;lineWidth=itemStyle.symbol.lineWidth||config.lineWidth;anchorSide=legendItemConfig.anchorSide;drawLine=legendItemConfig.drawLine;itemX=initialItemX+legendItemConfig._legendX;itemY=initialItemY+legendItemConfig._legendY;legendItemBackgroundCheck=legendItem.getGraphicalElement("legendItemBackground");legendItemTextCheck=legendItem.getGraphicalElement("legendItemText");legendItemLine=legendItem.getGraphicalElement("legendItemLine");legendItemSymbolCheck=legendItem.getGraphicalElement("legendItemSymbol");interactiveLegend=(0,_lib.pluck)(legendItemConfig.interactiveLegend,interactiveLegend);!interactiveLegend&&(itemStyle.cursor="default");textCosmetics=itemStyle.text;xPos=itemX+symbolBoxW+textPadding-2;yPos=itemY+(legendItemConfig._legendTestY||0);textCosmetics.text=legendItemConfig.name;textCosmetics.x=xPos;textCosmetics.y=yPos;legendItemText=animationManager.setAnimation({el:legendItemTextCheck||"text",attr:textCosmetics,component:legendItem,container:itemGroup,label:"icon"});if(!legendItemTextCheck){legendItemText=legendItem.addGraphicalElement("legendItemText",legendItemText)}legendItemText.data("legendItem",legendItemConfig);drawItemLine=false;if(drawCustomLegendIcon&&legendItemConfig.customLegendIcon!==false){customBorderColor=!hidden&&customLegendConfig.borderColor;customBorderAlpha=(0,_lib.pluck)(customLegendConfig.borderAlpha);customBgColor=!hidden&&customLegendConfig.bgColor;customBgAlpha=(0,_lib.pluck)(customLegendConfig.bgAlpha,"100");fillcolor=itemStyle.symbol.rawFillColor;fillColor=!hidden?customBgColor||fillcolor:itemStyle.symbol.fill;fillColor=(0,_lib.convertColor)(fillColor,customBgAlpha);strokecolor=itemStyle.symbol.rawStrokeColor;strokeColor=!hidden?customBorderColor||strokecolor||fillcolor:itemStyle.symbol.stroke;strokeColor=(0,_lib.convertColor)(strokeColor,customBorderAlpha);radius=symbolWidth*.5;cx=itemX+symbolPadding+radius;cy=itemY+(legendItemConfig._markerYGutter||0)+symbolPadding+radius;symbolStr=(0,_lib.mapSymbolName)(customLegendConfig.sides);symbol=symbolStr&&(0,_lib.mapSymbolName)(customLegendConfig.sides).split("_")||[];dip=symbol[0]==="spoke"?1:0;symbolAttr={path:(0,_lib.polyPathToPath)([symbol[1]||2,cx,cy,radius,customLegendConfig.startAngle||0,dip]),cursor:itemStyle.symbol.cursor||POINTER,stroke:strokeColor,fill:fillColor,"stroke-width":(0,_lib.pluckNumber)(customLegendConfig.borderThickness,1)}}else if(type==="line"||drawLine){cy=itemY+(legendItemConfig._markerYGutter||0)+symbolPadding+symbolWidth*.5;lineAttr={path:[M,itemX+symbolPadding,cy,L,itemX+symbolPadding+symbolWidth,cy]};drawItemLine=true;lineCosmetics={opacity:chartConfig.legendiconalpha||1,"stroke-width":lineWidth,stroke:strokeColor,cursor:itemStyle.cursor||POINTER};if(anchorSide){symbolAttr=getAnchorProps(legendItem,itemStyle.symbol)}}else if(anchorSide){symbolAttr=getAnchorProps(legendItem,itemStyle.symbol)}else if(type!=="line"){strokeColor=legendItemConfig.symbolStroke||strokeColor;symbolConfig=_getSymbolPath(itemX+symbolPadding,itemY+(legendItemConfig._markerYGutter||0)+symbolPadding,symbolWidth,symbolWidth,type);symbolAttr={path:symbolConfig.path,"stroke-width":.5,stroke:strokeColor,fill:fillColor,cursor:itemStyle.cursor||POINTER}}if(lineAttr&&drawItemLine){Object.assign(lineAttr,lineCosmetics);legendItemLine=animationManager.setAnimation({el:legendItemLine||"path",attr:lineAttr,component:legendItem,callback:function callback(){this.show()},container:itemGroup});if(!legendItem.getGraphicalElement("legendItemLine")){legendItemLine=legendItem.addGraphicalElement("legendItemLine",legendItemLine)}}else{if(legendItemLine){legendItemLine.hide()}}if(symbolAttr){symbolAttr.opacity=(0,_lib.pluckNumber)(itemStyle.symbol.opacity,1);legendItemSymbol=animationManager.setAnimation({el:legendItemSymbolCheck||"path",attr:symbolAttr,component:legendItem,callback:function callback(){this.show()},container:itemGroup,label:"icon"});if(!legendItemSymbolCheck||!legendItemSymbolCheck.node){legendItemSymbol=legendItem.addGraphicalElement("legendItemSymbol",legendItemSymbol)}legendItemSymbol.data("legendItem",legendItemConfig)}else{legendItemSymbolCheck&&legendItemSymbolCheck.hide()}if(itemStyle.background&&itemStyle.background.legendBackgroundColor){bgFill=(0,_lib.convertColor)(itemStyle.background.legendBackgroundColor,itemStyle.background.alpha)}else{bgFill=_lib.TRACKER_FILL}backgroundAttr={x:itemX,y:itemY,width:legendItemConfig._totalWidth,height:legendItemConfig._legendH,r:0,fill:bgFill,opacity:1,"stroke-width":1,stroke:NONE,cursor:itemStyle.symbol.cursor||POINTER};legendItemBackground=animationManager.setAnimation({el:legendItemBackgroundCheck||"rect",attr:backgroundAttr,css:backgroundCosmetics,component:legendItem,label:"background",container:itemGroup});if(!legendItemBackgroundCheck){legendItem.addGraphicalElement("legendItemBackground",legendItemBackground)}legendItemBackground.data("legendItem",legendItem).data("interactive",interactiveLegend).data("itemHoverStyle",itemHoverStyle).data("itemStyle",itemStyle)};return LegendItem}(_componentInterface.ComponentInterface);var _default=LegendItem;exports["default"]=_default;