@lxlib/chart
Version:
This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.1.1.
16 lines (14 loc) • 8.7 kB
JavaScript
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@antv/g2"),require("@lxlib/util"),require("rxjs"),require("rxjs/operators"),require("@angular/common"),require("ng-zorro-antd/core/outlet"),require("ng-zorro-antd/divider")):"function"==typeof define&&define.amd?define("@lxlib/chart/pie",["exports","@angular/core","@antv/g2","@lxlib/util","rxjs","rxjs/operators","@angular/common","ng-zorro-antd/core/outlet","ng-zorro-antd/divider"],t):t(((e=e||self).lxlib=e.lxlib||{},e.lxlib.chart=e.lxlib.chart||{},e.lxlib.chart.pie={}),e.ng.core,e.g2,e.lxlib.util,e.rxjs,e.rxjs.operators,e.ng.common,e["ng-zorro-antd/core/outlet"],e["ng-zorro-antd/divider"])}(this,(function(e,t,n,i,r,o,a,l,s){"use strict";
/*! *****************************************************************************
Copyright (c) Microsoft Corporation. All rights reserved.
Licensed under the Apache License, Version 2.0 (the "License"); you may not use
this file except in compliance with the License. You may obtain a copy of the
License at http://www.apache.org/licenses/LICENSE-2.0
THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
MERCHANTABLITY OR NON-INFRINGEMENT.
See the Apache Version 2.0 License for specific language governing permissions
and limitations under the License.
***************************************************************************** */function c(e,t,n,i){var r,o=arguments.length,a=o<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,n,i);else for(var l=e.length-1;l>=0;l--)(r=e[l])&&(a=(o<3?r(a):o>3?r(t,n,a):r(t,n))||a);return o>3&&a&&Object.defineProperty(t,n,a),a}function p(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)}function u(e){var t="function"==typeof Symbol&&Symbol.iterator,n=t&&e[t],i=0;if(n)return n.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&i>=e.length&&(e=void 0),{value:e&&e[i++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")}function d(e,t){var n="function"==typeof Symbol&&e[Symbol.iterator];if(!n)return e;var i,r,o=n.call(e),a=[];try{for(;(void 0===t||t-- >0)&&!(i=o.next()).done;)a.push(i.value)}catch(e){r={error:e}}finally{try{i&&!i.done&&(n=o.return)&&n.call(o)}finally{if(r)throw r.error}}return a}function h(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(d(arguments[t]));return e}var g=function(){function e(e,t,n,i){this.el=e,this.rend=t,this.ngZone=n,this.cdr=i,this.legendData=[],this.delay=0,this.animate=!0,this.color="rgba(24, 144, 255, 0.85)",this.height=0,this.hasLegend=!1,this.inner=.75,this.padding=[12,0,12,0],this.tooltip=!0,this.lineWidth=0,this.select=!0,this.data=[],this.interaction="none"}return e.prototype.setCls=function(){var e=this.el,t=this.rend,n=this.hasLegend,r=this.isPercent,o=e.nativeElement;i.updateHostClass(o,t,{"g2-pie":!0,"g2-pie__legend-has":n,"g2-pie__legend-block":n&&o.clientWidth<=380,"g2-pie__mini":r},!0)},e.prototype.fixData=function(){var e=this.percent,t=this.color;this.isPercent=null!=e,this.isPercent&&(this.select=!1,this.tooltip=!1,this.percentColor=function(e){return"占比"===e?t||"rgba(24, 144, 255, 0.85)":"#F0F2F5"},this.data=[{x:"占比",y:e},{x:"反比",y:100-e}])},e.prototype.install=function(){this.setCls();var e=this,t=e.node,i=e.height,r=e.padding,o=e.tooltip,a=e.inner,l=e.hasLegend,s=e.interaction,c=this.chart=new n.Chart({container:t.nativeElement,autoFit:!0,height:i,padding:r});o?c.tooltip({showTitle:!1,showMarkers:!1}):c.tooltip(!1),"none"!==s&&c.interaction(s),c.axis(!1).legend(!1).coordinate("theta",{innerRadius:a}),c.filter("x",(function(e,t){return!1!==t.checked})),c.interval().adjust("stack").position("y").tooltip("x*percent",(function(e,t){return{name:e,value:(l?t:(100*t).toFixed(2))+" %"}})).state({}),this.attachChart()},e.prototype.attachChart=function(){var e,t,n=this,i=this,r=i.chart,o=i.height,a=i.padding,l=i.animate,s=i.data,c=i.lineWidth,p=i.isPercent,d=i.percentColor,h=i.colors;if(r){r.height=o,r.padding=a,r.animate(l),r.geometries[0].style({lineWidth:c,stroke:"#fff"}).color("x",p?d:h),r.scale({x:{type:"cat",range:[0,1]}});var g=s.reduce((function(e,t){return e+t.y}),0);try{for(var y=u(s),f=y.next();!f.done;f=y.next()){var v=f.value;v.percent=0===g?0:v.y/g}}catch(t){e={error:t}}finally{try{f&&!f.done&&(t=y.return)&&t.call(y)}finally{if(e)throw e.error}}r.changeData(s),this.ngZone.run((function(){return n.genLegend()}))}},e.prototype.genLegend=function(){var e=this.hasLegend,t=this.isPercent,n=this.cdr,i=this.chart;e&&!t&&(this.legendData=i.geometries[0].dataArray.map((function(e){var t=e[0]._origin;return t.color=e[0].color,t.checked=!0,t.percent=(100*t.percent).toFixed(2),t})),n.detectChanges())},e.prototype._click=function(e){var t=this.legendData,n=this.chart;t[e].checked=!t[e].checked,n.render()},e.prototype.installResizeEvent=function(){var e=this;!this.resize$&&this.hasLegend&&(this.resize$=r.fromEvent(window,"resize").pipe(o.debounceTime(200)).subscribe((function(){return e.setCls()})))},e.prototype.ngOnInit=function(){var e=this;this.ngZone.runOutsideAngular((function(){return setTimeout((function(){return e.install()}),e.delay)}))},e.prototype.ngOnChanges=function(){var e=this;this.fixData(),this.setCls(),this.ngZone.runOutsideAngular((function(){return e.attachChart()})),this.installResizeEvent()},e.prototype.ngOnDestroy=function(){var e=this;this.resize$&&this.resize$.unsubscribe(),this.chart&&this.ngZone.runOutsideAngular((function(){return e.chart.destroy()}))},e.decorators=[{type:t.Component,args:[{selector:"g2-pie",exportAs:"g2Pie",template:'<div class="g2-pie__chart">\n <div #container></div>\n <div *ngIf="subTitle || total"\n class="g2-pie__total">\n <h4 *ngIf="subTitle"\n class="g2-pie__total-title">\n <ng-container *nzStringTemplateOutlet="subTitle">\n <div [innerHTML]="subTitle"></div>\n </ng-container>\n </h4>\n <div *ngIf="total" class="g2-pie__total-stat">\n <ng-container *nzStringTemplateOutlet="total">\n <div [innerHTML]="total"></div>\n </ng-container>\n </div>\n </div>\n</div>\n<ul *ngIf="hasLegend && legendData?.length"\n class="g2-pie__legend">\n <li *ngFor="let item of legendData; let index = index" (click)="_click(index)" class="g2-pie__legend-item">\n <span class="g2-pie__legend-dot" [ngStyle]="{\'background-color\': !item.checked ? \'#aaa\' : item.color}"></span>\n <span class="g2-pie__legend-title">{{item.x}}</span>\n <nz-divider nzType="vertical"></nz-divider>\n <span class="g2-pie__legend-percent">{{item.percent}}%</span>\n <span class="g2-pie__legend-value" [innerHTML]="valueFormat ? valueFormat(item.y) : item.y"></span>\n </li>\n</ul>\n',preserveWhitespaces:!1,changeDetection:t.ChangeDetectionStrategy.OnPush,encapsulation:t.ViewEncapsulation.None}]}],e.ctorParameters=function(){return[{type:t.ElementRef},{type:t.Renderer2},{type:t.NgZone},{type:t.ChangeDetectorRef}]},e.propDecorators={node:[{type:t.ViewChild,args:["container",{static:!0}]}],delay:[{type:t.Input}],animate:[{type:t.Input}],color:[{type:t.Input}],subTitle:[{type:t.Input}],total:[{type:t.Input}],height:[{type:t.Input}],hasLegend:[{type:t.Input}],inner:[{type:t.Input}],padding:[{type:t.Input}],percent:[{type:t.Input}],tooltip:[{type:t.Input}],lineWidth:[{type:t.Input}],select:[{type:t.Input}],valueFormat:[{type:t.Input}],data:[{type:t.Input}],colors:[{type:t.Input}],interaction:[{type:t.Input}]},c([i.InputNumber(),p("design:type",Object)],e.prototype,"delay",void 0),c([i.InputBoolean(),p("design:type",Object)],e.prototype,"animate",void 0),c([i.InputNumber(),p("design:type",Object)],e.prototype,"height",void 0),c([i.InputBoolean(),p("design:type",Object)],e.prototype,"hasLegend",void 0),c([i.InputNumber(),p("design:type",Number)],e.prototype,"percent",void 0),c([i.InputBoolean(),p("design:type",Object)],e.prototype,"tooltip",void 0),c([i.InputNumber(),p("design:type",Object)],e.prototype,"lineWidth",void 0),c([i.InputBoolean(),p("design:type",Object)],e.prototype,"select",void 0),e}();var y=[g],f=function(){function e(){}return e.decorators=[{type:t.NgModule,args:[{imports:[a.CommonModule,i.LxlibUtilModule,s.NzDividerModule,l.NzOutletModule],declarations:h(y),exports:h(y)}]}],e}();e.G2PieComponent=g,e.G2PieModule=f,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=pie.umd.min.js.map