UNPKG

@v-charts2/sankey

Version:

echarts 桑葚图

8 lines (7 loc) 12.8 kB
/* eslint-disable */ /** * name: @v-charts2/sankey * version: v1.0.1-alpha.4 * author: vxhly <pengchengou@gmail.com> */ var __defProp=Object.defineProperty,__getOwnPropSymbols=Object.getOwnPropertySymbols,__hasOwnProp=Object.prototype.hasOwnProperty,__propIsEnum=Object.prototype.propertyIsEnumerable,__defNormalProp=(e,t,n)=>t in e?__defProp(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,__spreadValues=(e,t)=>{for(var n in t||(t={}))__hasOwnProp.call(t,n)&&__defNormalProp(e,n,t[n]);if(__getOwnPropSymbols)for(var n of __getOwnPropSymbols(t))__propIsEnum.call(t,n)&&__defNormalProp(e,n,t[n]);return e};!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("numerify"),require("utils-lite"),require("echarts/components"),require("echarts/core"),require("echarts/features"),require("echarts/renderers"),require("vue"),require("echarts/charts")):"function"==typeof define&&define.amd?define(["exports","numerify","utils-lite","echarts/components","echarts/core","echarts/features","echarts/renderers","vue","echarts/charts"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self)["@v-charts2/sankey"]=e["@v-charts2/sankey"]||{},e.numerify,e.utilsLite,e["echarts/components"],e.echartsLib,e["echarts/features"],e["echarts/renderers"],e.Vue,e["echarts/charts"])}(this,(function(e,t,n,o,r,a,i,l,s){"use strict";function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function p(e){if(e&&e.__esModule)return e;var t={__proto__:null,[Symbol.toStringTag]:"Module"};return e&&Object.keys(e).forEach((function(n){if("default"!==n){var o=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,o.get?o:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var d=c(t),u=p(r);const h={categoryAxis:{axisLine:{show:!1},axisTick:{show:!1},splitLine:{show:!1}},valueAxis:{axisLine:{show:!1}},line:{smooth:!0},legend:{top:20},grid:{containLabel:!0,top:100,left:20,right:20,bottom:20}},y=["#19d4ae","#5ab1ef","#fa6e86","#ffb980","#0067a6","#c4b4e4","#d87a80","#9cbbff","#d9d0c7","#87a997","#d49ea2","#5b4947","#7ba3a8"],f=["initOptions","loading","dataEmpty","judgeWidth","widthChangeDelay"],b=["grid","dataZoom","visualMap","toolbox","title","legend","xAxis","yAxis","radar","tooltip","axisPointer","brush","geo","timeline","graphic","series","backgroundColor","textStyle"];u.use([o.TitleComponent,o.TooltipComponent,o.GridComponent,o.DatasetComponent,o.TransformComponent,a.LabelLayout,a.UniversalTransition,i.SVGRenderer,i.CanvasRenderer,o.LegendComponent]);const v=(e,t,o,r="-")=>{if(isNaN(e))return r;if(!t)return e;if(n.isFunction(t))return t(e,d.default);o=isNaN(o)?0:++o;const a=`.[${new Array(o).join(0)}]`;let i=t;switch(t){case"KMB":i=o?`0,0${a}a`:"0,0a";break;case"normal":i=o?`0,0${a}`:"0,0";break;case"percent":i=o?`0,0${a}%`:"0,0.[00]%"}return d.default(e,i)};const m={data:{type:[Object,Array],default:()=>({})},settings:{type:Object,default:()=>({})},width:{type:String,default:"auto"},height:{type:String,default:"400px"},beforeConfig:{type:Function},afterConfig:{type:Function},afterSetOption:{type:Function},afterSetOptionOnce:{type:Function},events:{type:Object},grid:{type:[Object,Array]},colors:{type:Array},tooltipVisible:{type:Boolean,default:!0},legendVisible:{type:Boolean,default:!0},legendPosition:{type:String},markLine:{type:Object},markArea:{type:Object},markPoint:{type:Object},visualMap:{type:[Object,Array]},dataZoom:{type:[Object,Array]},toolbox:{type:[Object,Array]},initOptions:{type:Object,default:()=>({})},title:[Object,Array],legend:[Object,Array],xAxis:[Object,Array],yAxis:[Object,Array],radar:Object,tooltip:Object,axisPointer:[Object,Array],brush:[Object,Array],geo:[Object,Array],timeline:[Object,Array],graphic:[Object,Array],series:[Object,Array],backgroundColor:[Object,String],textStyle:[Object,Array],animation:Object,theme:Object,themeName:String,loading:Boolean,dataEmpty:Boolean,extend:Object,judgeWidth:{type:Boolean,default:!1},widthChangeDelay:{type:Number,default:300},tooltipFormatter:{type:Function},resizeable:{type:Boolean,default:!0},resizeDelay:{type:Number,default:200},changeDelay:{type:Number,default:0},setOptionOpts:{type:[Boolean,Object],default:!0},cancelResizeCheck:Boolean,notSetUnchange:Array,log:Boolean,renderer:{type:String,default:"canvas",validator:e=>["svg","canvas"].indexOf(e)>-1}};function g(e,t){Object.keys(t).forEach((n=>{t[n]&&(e[n]=t[n])}))}const O=({echarts:e,props:t,canvas:n,options:o}={})=>{if(e)return;const{registeredEvents:r,_once:a,el:i}=o,l=(null==t?void 0:t.themeName)||(null==t?void 0:t.theme)||h;return e=u.init(n,l,__spreadValues({renderer:null==t?void 0:t.renderer},null==t?void 0:t.initOptions)),(null==t?void 0:t.data)&&j({props:t,options:o,echarts:e}),k({registeredEvents:r,echarts:e,props:t}),(null==t?void 0:t.resizeable)&&x({_once:a,props:t,el:i,echarts:e}),{echarts:e}},j=({props:e,options:t,echarts:o}={})=>n.debounce(S({props:e,options:t,echarts:o}),null==e?void 0:e.changeDelay),_=({props:e,el:t,echarts:o}={})=>n.debounce(P({props:e,el:t,echarts:o}),null==e?void 0:e.resizeDelay),k=({registeredEvents:e,echarts:t,props:n})=>{const o=Object.keys((null==n?void 0:n.events)||{});o.length&&o.forEach((o=>{var r;-1===e.indexOf(o)&&(e.push(o),t.on(o,(r=o,function(...e){r in n.events&&(null==n||n.events[r].apply(null,e))})))}))},x=({_once:e,props:t,el:n,echarts:o})=>{window.addEventListener("resize",(()=>_({props:t,el:n,echarts:o}))),e.onresize=!0},w=({_once:e})=>{window.removeEventListener("resize",_),e.onresize=!1},S=({props:e,options:t,echarts:n}={})=>{const{chartHandler:o,chartColor:r,_once:a}=t;if(!o)return;let i=null==e?void 0:e.data;const{columns:l=[],rows:s=[]}=i,c={tooltipVisible:null==e?void 0:e.tooltipVisible,legendVisible:null==e?void 0:e.legendVisible,echarts:n,color:r,tooltipFormatter:null==e?void 0:e.tooltipFormatter,_once:a};(null==e?void 0:e.beforeConfig)&&(i=null==e?void 0:e.beforeConfig(i));const p=o(l,s,null==e?void 0:e.settings,c);p&&("function"==typeof p.then?p.then((o=>{A({chartOptions:o,props:e,options:t,echarts:n})})):A({chartOptions:p,props:e,options:t,echarts:n}))},A=({chartOptions:e,props:t,options:o,echarts:r,nextTick:a})=>{const{chartColor:i,_store:l,_once:s,el:c,readyCallback:p,readyOnceCallback:d}=o;if((null==t?void 0:t.legendPosition)&&e.legend&&(e.legend[null==t?void 0:t.legendPosition]=10,~["left","right"].indexOf(null==t?void 0:t.legendPosition)&&(e.legend.top="middle",e.legend.orient="vertical")),e.color=i,b.forEach((n=>{(null==t?void 0:t[n])&&(e[n]=null==t?void 0:t[n])})),(null==t?void 0:t.animation)&&function(e,t){Object.keys(t).forEach((n=>{e[n]=t[n]}))}(e,null==t?void 0:t.animation),(null==t?void 0:t.markArea)||(null==t?void 0:t.markLine)||(null==t?void 0:t.markPoint)){const o={markArea:null==t?void 0:t.markArea,markLine:null==t?void 0:t.markLine,markPoint:null==t?void 0:t.markPoint},r=e.series;n.isArray(r)?r.forEach((e=>{g(e,o)})):n.isObject(r)&&g(r,o)}(null==t?void 0:t.extend)&&function(e,t){Object.keys(t).forEach((o=>{const r=t[o];~o.indexOf(".")?n.set(e,o,r):"function"==typeof r?e[o]=r(e[o]):n.isArray(e[o])&&n.isObject(e[o][0])?e[o].forEach(((t,n)=>{e[o][n]=Object.assign({},t,r)})):n.isObject(e[o])?e[o]=Object.assign({},e[o],r):e[o]=r}))}(e,null==t?void 0:t.extend),(null==t?void 0:t.afterConfig)&&(e=null==t?void 0:t.afterConfig(e));let h=null==t?void 0:t.setOptionOpts;!(null==t?void 0:t.settings.bmap)&&!(null==t?void 0:t.settings.amap)||n.isObject(h)||(h=!1),(null==t?void 0:t.notSetUnchange)&&(null==t?void 0:t.notSetUnchange.length)&&(null==t||t.notSetUnchange.forEach((t=>{const o=e[t];o&&(n.isEqual(o,l[t])?e[t]=void 0:l[t]=n.cloneDeep(o))})),n.isObject(h)?h.notMerge=!1:h=!1),null==t||t.log,r.setOption(e,h),p instanceof Function&&p(r,e,u),s["ready-once"]||(s["ready-once"]=!0,d instanceof Function&&d(r,e,u)),(null==t?void 0:t.judgeWidth)&&C({props:t,el:c,nextTick:a,echarts:r}),(null==t?void 0:t.afterSetOption)&&(null==t||t.afterSetOption(r,e,u)),(null==t?void 0:t.afterSetOptionOnce)&&!s.afterSetOptionOnce&&(s.afterSetOptionOnce=!0,null==t||t.afterSetOptionOnce(r,e,u))},C=({props:e,el:t,nextTick:n,echarts:o})=>{t.clientWidth||t.clientHeight?P({props:e,el:t,echarts:o}):n((()=>{t.clientWidth||t.clientHeight?P({props:e,el:t,echarts:o}):setTimeout((()=>{P({props:e,el:t,echarts:o}),!t.clientWidth||t.clientHeight}),null==e?void 0:e.widthChangeDelay)}))},P=({props:e,el:t,echarts:n}={})=>{((null==e?void 0:e.cancelResizeCheck)||t&&t.clientWidth&&t.clientHeight)&&T(n)},T=e=>{e&&e.resize()},E=(e,t)=>{let{echarts:n,option:{_once:o}}=e;z({echarts:n,props:t,_once:o}),n=null,O(e)},z=({echarts:e,props:t,_once:n})=>{(null==t?void 0:t.resizeable)&&w({_once:n}),e&&e.dispose()};u.use([s.SankeyChart]);const D=(({name:e,chartHandler:t,chartLib:o})=>({name:e,props:m,setup(r,{slots:a,emit:i}){let s=null;const c=[],p={},d=[];let u=null;u=j||o[r.settings.type];const h=l.computed((()=>({width:null==r?void 0:r.width,height:null==r?void 0:r.height,position:"relative"}))),b=l.computed((()=>(null==r?void 0:r.colors)||(null==r?void 0:r.theme)&&(null==r?void 0:r.theme.color)||y)),v=l.h("div",{class:"v-charts-data-empty"},"暂无数据"),m=l.h("div",{class:"v-charts-component-loading"},[l.h("div",{class:"loader"},[l.h("div",{class:"loading-spinner"},[l.h("svg",{class:"circular",viewBox:"25 25 50 50"},[l.h("circle",{class:"path",cx:"50",cy:"50",r:"20",fill:"none"})])])])]),g=l.h("div",{style:h.value,class:{"v-charts-mask-status":(null==r?void 0:r.dataEmpty)||(null==r?void 0:r.loading)}}),_=l.h("div",{class:[n.camelToKebab(e)],style:h.value},[g,l.h(v,{style:{display:(null==r?void 0:r.dataEmpty)?"":"none"}}),l.h(m,{style:{display:(null==r?void 0:r.loading)?"":"none"}}),a.default]),S={echarts:s,props:r,canvas:g.el,options:{el:_.el,registeredEvents:c,chartHandler:t,chartColor:b.value,_once:p,_store:{},readyCallback:(e,t,n)=>{i("ready",e,t,n)},readyOnceCallback:(e,t,n)=>{i("ready-once",e,t,n)}},nextTick:l.nextTick},A=()=>{l.nextTick(P({props:r,el:_.el,echarts:s}))};l.watch((()=>null==r?void 0:r.data),(e=>{e&&u({props:r,options:S.options,echarts:s})}),{deep:!0}),l.watch((()=>null==r?void 0:r.settings),(e=>{e.type&&o&&(t=o[e.type]),S.options.chartHandler=o[e.type],u({props:r,options:S.options,echarts:s})}),{deep:!0}),l.watch((()=>null==r?void 0:r.width),(()=>A())),l.watch((()=>null==r?void 0:r.height),(()=>A())),l.watch((()=>null==r?void 0:r.events),(()=>k({registeredEvents:c,echarts:s,props:r})),{deep:!0}),l.watch((()=>null==r?void 0:r.theme),(()=>{l.nextTick((()=>{S.canvas=g.el,S.options.el=_.el,E(S,r)}))}),{deep:!0}),l.watch((()=>null==r?void 0:r.themeName),(()=>{l.nextTick((()=>{S.canvas=g.el,S.options.el=_.el,E(S,r)}))})),l.watch((()=>null==r?void 0:r.resizeable),(e=>{l.nextTick((()=>{(({resizeable:e,_once:t,props:n,el:o,echarts:r})=>{e&&!t.onresize&&x({_once:t,props:n,el:o,echarts:r}),!e&&t.onresize&&w({_once:t})})({resizeable:e,_once:p,props:r,el:_.el,echarts:s})}))}));return l.onMounted((()=>{S.canvas=g.el,S.options.el=_.el;const{echarts:e}=O(S);s=e,(({_watchers:e,props:t,options:o,echarts:r})=>{const a=e.map((e=>e.expression));Object.keys(t).forEach((e=>{if(!~a.indexOf(e)&&!~f.indexOf(e)){const a={};~["[object Object]","[object Array]"].indexOf(n.getType(t[e]))&&(a.deep=!0),l.watch((()=>e),(()=>u({props:t,options:o,echarts:r})),a)}}))})({_watchers:d,props:r,options:S.options,echarts:s})})),l.onBeforeUnmount((()=>{z({echarts:s,props:r,_once:p})})),()=>_}}))({name:"VeSankey",chartHandler:(e,t,n,o)=>{const{links:r,dimension:a=e[0],metrics:i=e[1],dataType:l=["normal","normal"],digit:s=2,valueFull:c=!1,useDataValue:p=!1,label:d,itemStyle:u,lineStyle:h}=n;if(!r)return;const y=function(e){const{itemDataType:t,linksDataType:n,digit:o}=e;return{trigger:"item",formatter(e){const r=[],{name:a,data:i,value:l,color:s}=e;return r.push((e=>['<span style="',`background-color:${e};`,"display: inline-block;","width: 10px;","height: 10px;","border-radius: 50%;","margin-right:2px;",'"></span>'].join(""))(s)),r.push(`${a} : `),i&&i.source?r.push(`${v(l,n,o)}<br />`):r.push(`${v(l,t,o)}<br />`),r.join("")}}}({itemDataType:l[0],linksDataType:l[1],digit:s}),f=function(e){const{rows:t,dimension:n,metrics:o,links:r,valueFull:a,useDataValue:i,label:l,itemStyle:s,lineStyle:c}=e,p={},d=t.map((e=>(p[e[n]]=e[o],{name:e[n],value:e[o]})));let u=null;u=i?r.map((e=>Object.assign({},e,{value:p[e.target]}))):a?r:r.map((e=>null==e.value?Object.assign({},e,{value:p[e.target]}):e));const h={type:"sankey",data:d,links:u};return l&&(h.label=l),s&&(h.itemStyle=s),c&&(h.lineStyle=c),[h]}({rows:t,dimension:a,metrics:i,links:r,valueFull:c,useDataValue:p,label:d,itemStyle:u,lineStyle:h});return{tooltip:y,series:f}}});D.install=e=>{e.component(D.name,D)},e.default=D,Object.defineProperty(e,"__esModule",{value:!0}),e[Symbol.toStringTag]="Module"}));