Echarts 里的桑基图

/*输出桑基图*/renderSankey: function (profileIdentity, canvasId) {if (!document.body.contains(document.getElementById(canvasId)))return;var sankeyDom = document.getElementById(canvasId);var sankeyChart = echarts.init(sankeyDom);sankeyChart.showLoading();SendRequest('GET', '/home/sankey/' + profileIdentity, undefined, this.getToken()).then((response) => {sankeyChart.hideLoading();var data = JSON.parse(response);sankeyChart.setOption((option = {tooltip: {trigger: 'item',triggerOn: 'mousemove'},animation: false,series: [{type: 'sankey',emphasis: {focus: 'adjacency'},nodeAlign: 'right',data: data.data,links: data.links,lineStyle: {color: 'source',curveness: 0.5}}]}));window.addEventListener("resize", resizeMe);});function resizeMe() {sankeyChart.resize();}},

桑基图的数据格式是

{"Data":[{"Name":"000795","ItemStyle":{"Color":"#FF0000","BorderColor":"#FF0000"}},{"Name":"300618","ItemStyle":{"Color":"#FF0000","BorderColor":"#FF0000"}},{"Name":"DAILY:AMOUNT:GE","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"DAILY:BIAS:GE","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"DAILY:CCI:GE100","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"DAILY:DMI:GE","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"DAILY:KD:GE","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"DAILY:MACD:GE","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"DAILY:MACD:UC0","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"DAILY:MACD:GE0","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"WEEKLY:AMOUNT:GE","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"WEEKLY:BIAS:GE","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"WEEKLY:BIAS:UC","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"WEEKLY:CCI:UC100","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"WEEKLY:CCI:GE100","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"WEEKLY:DMI:GE","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"WEEKLY:DMI:UC","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"WEEKLY:KD:GE","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"WEEKLY:MA:UC","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"WEEKLY:MACD:GE","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"WEEKLY:MACD:UC","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"WEEKLY:MACD:UC0","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"WEEKLY:MACD:GE0","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"MONTHLY:AMOUNT:GE","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"MONTHLY:BIAS:GE","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"MONTHLY:BIAS:UC","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"MONTHLY:CCI:NORMAL","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"MONTHLY:DMI:GE","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"MONTHLY:KD:GE","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"MONTHLY:KD:UC","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"MONTHLY:MA:UP","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"MONTHLY:MACD:GE","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"MONTHLY:MACD:UC0","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"MONTHLY:MACD:GE0","ItemStyle":{"Color":"#DDDDDD","BorderColor":"#DDDDDD"}},{"Name":"AMOUNT","ItemStyle":{"Color":"#000000","BorderColor":"#000000"}},{"Name":"BIAS","ItemStyle":{"Color":"#000000","BorderColor":"#000000"}},{"Name":"CCI","ItemStyle":{"Color":"#000000","BorderColor":"#000000"}},{"Name":"DMI","ItemStyle":{"Color":"#000000","BorderColor":"#000000"}},{"Name":"KD","ItemStyle":{"Color":"#000000","BorderColor":"#000000"}},{"Name":"MACD","ItemStyle":{"Color":"#000000","BorderColor":"#000000"}},{"Name":"MA","ItemStyle":{"Color":"#000000","BorderColor":"#000000"}},{"Name":"DAILY:AMOUNT","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}},{"Name":"DAILY:BIAS","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}},{"Name":"DAILY:CCI","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}},{"Name":"DAILY:DMI","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}},{"Name":"DAILY:KD","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}},{"Name":"DAILY:MACD","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}},{"Name":"WEEKLY:AMOUNT","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}},{"Name":"WEEKLY:BIAS","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}},{"Name":"WEEKLY:CCI","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}},{"Name":"WEEKLY:DMI","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}},{"Name":"WEEKLY:KD","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}},{"Name":"WEEKLY:MA","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}},{"Name":"WEEKLY:MACD","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}},{"Name":"MONTHLY:AMOUNT","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}},{"Name":"MONTHLY:BIAS","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}},{"Name":"MONTHLY:CCI","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}},{"Name":"MONTHLY:DMI","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}},{"Name":"MONTHLY:KD","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}},{"Name":"MONTHLY:MA","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}},{"Name":"MONTHLY:MACD","ItemStyle":{"Color":"#999999","BorderColor":"#999999"}}],"Links":[{"Source":"DAILY:AMOUNT","Target":"AMOUNT","Value":1.0},{"Source":"WEEKLY:AMOUNT","Target":"AMOUNT","Value":1.0},{"Source":"MONTHLY:AMOUNT","Target":"AMOUNT","Value":1.0},{"Source":"DAILY:AMOUNT:GE","Target":"DAILY:AMOUNT","Value":1.0},{"Source":"WEEKLY:AMOUNT:GE","Target":"WEEKLY:AMOUNT","Value":1.0},{"Source":"MONTHLY:AMOUNT:GE","Target":"MONTHLY:AMOUNT","Value":1.0},{"Source":"DAILY:BIAS","Target":"BIAS","Value":1.0},{"Source":"WEEKLY:BIAS","Target":"BIAS","Value":1.0},{"Source":"MONTHLY:BIAS","Target":"BIAS","Value":1.0},{"Source":"DAILY:BIAS:GE","Target":"DAILY:BIAS","Value":1.0},{"Source":"WEEKLY:BIAS:GE","Target":"WEEKLY:BIAS","Value":1.0},{"Source":"WEEKLY:BIAS:UC","Target":"WEEKLY:BIAS","Value":1.0},{"Source":"MONTHLY:BIAS:GE","Target":"MONTHLY:BIAS","Value":1.0},{"Source":"MONTHLY:BIAS:UC","Target":"MONTHLY:BIAS","Value":1.0},{"Source":"DAILY:CCI","Target":"CCI","Value":1.0},{"Source":"WEEKLY:CCI","Target":"CCI","Value":1.0},{"Source":"MONTHLY:CCI","Target":"CCI","Value":1.0},{"Source":"DAILY:CCI:GE100","Target":"DAILY:CCI","Value":1.0},{"Source":"WEEKLY:CCI:UC100","Target":"WEEKLY:CCI","Value":1.0},{"Source":"WEEKLY:CCI:GE100","Target":"WEEKLY:CCI","Value":1.0},{"Source":"MONTHLY:CCI:NORMAL","Target":"MONTHLY:CCI","Value":1.0},{"Source":"DAILY:DMI","Target":"DMI","Value":1.0},{"Source":"WEEKLY:DMI","Target":"DMI","Value":1.0},{"Source":"MONTHLY:DMI","Target":"DMI","Value":1.0},{"Source":"DAILY:DMI:GE","Target":"DAILY:DMI","Value":1.0},{"Source":"WEEKLY:DMI:GE","Target":"WEEKLY:DMI","Value":1.0},{"Source":"WEEKLY:DMI:UC","Target":"WEEKLY:DMI","Value":1.0},{"Source":"MONTHLY:DMI:GE","Target":"MONTHLY:DMI","Value":1.0},{"Source":"DAILY:KD","Target":"KD","Value":1.0},{"Source":"WEEKLY:KD","Target":"KD","Value":1.0},{"Source":"MONTHLY:KD","Target":"KD","Value":1.0},{"Source":"DAILY:KD:GE","Target":"DAILY:KD","Value":1.0},{"Source":"WEEKLY:KD:GE","Target":"WEEKLY:KD","Value":1.0},{"Source":"MONTHLY:KD:GE","Target":"MONTHLY:KD","Value":1.0},{"Source":"MONTHLY:KD:UC","Target":"MONTHLY:KD","Value":1.0},{"Source":"MACD","Target":"DAILY:MACD","Value":2.0},{"Source":"MACD","Target":"WEEKLY:MACD","Value":2.0},{"Source":"MACD","Target":"MONTHLY:MACD","Value":2.0},{"Source":"DAILY:MACD","Target":"DAILY:MACD:GE","Value":2.0},{"Source":"DAILY:MACD","Target":"DAILY:MACD:UC0","Value":2.0},{"Source":"DAILY:MACD","Target":"DAILY:MACD:GE0","Value":2.0},{"Source":"WEEKLY:MACD","Target":"WEEKLY:MACD:GE","Value":2.0},{"Source":"WEEKLY:MACD","Target":"WEEKLY:MACD:UC","Value":2.0},{"Source":"WEEKLY:MACD","Target":"WEEKLY:MACD:UC0","Value":2.0},{"Source":"WEEKLY:MACD","Target":"WEEKLY:MACD:GE0","Value":2.0},{"Source":"MONTHLY:MACD","Target":"MONTHLY:MACD:GE","Value":2.0},{"Source":"MONTHLY:MACD","Target":"MONTHLY:MACD:UC0","Value":2.0},{"Source":"MONTHLY:MACD","Target":"MONTHLY:MACD:GE0","Value":2.0},{"Source":"WEEKLY:MA","Target":"MA","Value":1.0},{"Source":"MONTHLY:MA","Target":"MA","Value":1.0},{"Source":"WEEKLY:MA:UC","Target":"WEEKLY:MA","Value":1.0},{"Source":"WEEKLY:MACD:GE","Target":"WEEKLY:MA","Value":1.0},{"Source":"WEEKLY:MACD:UC","Target":"WEEKLY:MA","Value":1.0},{"Source":"WEEKLY:MACD:UC0","Target":"WEEKLY:MA","Value":1.0},{"Source":"WEEKLY:MACD:GE0","Target":"WEEKLY:MA","Value":1.0},{"Source":"MONTHLY:MA:UP","Target":"MONTHLY:MA","Value":1.0},{"Source":"MONTHLY:MACD:GE","Target":"MONTHLY:MA","Value":1.0},{"Source":"MONTHLY:MACD:UC0","Target":"MONTHLY:MA","Value":1.0},{"Source":"MONTHLY:MACD:GE0","Target":"MONTHLY:MA","Value":1.0},{"Source":"000795","Target":"DAILY:AMOUNT:GE","Value":1395.00},{"Source":"000795","Target":"DAILY:AMOUNT:UC","Value":1395.00},{"Source":"000795","Target":"DAILY:BIAS:GE","Value":1395.00},{"Source":"000795","Target":"DAILY:CCI:GE100","Value":1395.00},{"Source":"000795","Target":"DAILY:DMI:GE","Value":1395.00},{"Source":"000795","Target":"DAILY:KD:LT","Value":1395.00},{"Source":"000795","Target":"DAILY:KD:DC","Value":1395.00},{"Source":"000795","Target":"DAILY:MA:UP","Value":1395.00},{"Source":"DAILY:MACD:GE","Target":"000795","Value":1395.00},{"Source":"DAILY:MACD:UC0","Target":"000795","Value":1395.00},{"Source":"DAILY:MACD:GE0","Target":"000795","Value":1395.00},{"Source":"000795","Target":"WEEKLY:AMOUNT:LT","Value":1395.00},{"Source":"000795","Target":"WEEKLY:BIAS:GE","Value":1395.00},{"Source":"000795","Target":"WEEKLY:CCI:NORMAL","Value":1395.00},{"Source":"000795","Target":"WEEKLY:DMI:GE","Value":1395.00},{"Source":"000795","Target":"WEEKLY:KD:GE","Value":1395.00},{"Source":"WEEKLY:MACD:UC0","Target":"000795","Value":1395.00},{"Source":"WEEKLY:MACD:LT","Target":"000795","Value":1395.00},{"Source":"WEEKLY:MACD:GE0","Target":"000795","Value":1395.00},{"Source":"000795","Target":"MONTHLY:AMOUNT:GE","Value":1395.00},{"Source":"000795","Target":"MONTHLY:BIAS:GE","Value":1395.00},{"Source":"000795","Target":"MONTHLY:BIAS:UC","Value":1395.00},{"Source":"000795","Target":"MONTHLY:CCI:UC100","Value":1395.00},{"Source":"000795","Target":"MONTHLY:CCI:GE100","Value":1395.00},{"Source":"000795","Target":"MONTHLY:CCI:GE250","Value":1395.00},{"Source":"000795","Target":"MONTHLY:DMI:GE","Value":1395.00},{"Source":"000795","Target":"MONTHLY:KD:GE","Value":1395.00},{"Source":"000795","Target":"MONTHLY:KD:UC","Value":1395.00},{"Source":"MONTHLY:MACD:GE","Target":"000795","Value":1395.00},{"Source":"MONTHLY:MACD:UC0","Target":"000795","Value":1395.00},{"Source":"MONTHLY:MACD:GE0","Target":"000795","Value":1395.00},{"Source":"300618","Target":"DAILY:AMOUNT:GE","Value":175.60},{"Source":"300618","Target":"DAILY:BIAS:GE","Value":175.60},{"Source":"300618","Target":"DAILY:CCI:GE100","Value":175.60},{"Source":"300618","Target":"DAILY:DMI:GE","Value":175.60},{"Source":"300618","Target":"DAILY:KD:GE","Value":175.60},{"Source":"DAILY:MACD:GE","Target":"300618","Value":175.60},{"Source":"DAILY:MACD:UC0","Target":"300618","Value":175.60},{"Source":"DAILY:MACD:GE0","Target":"300618","Value":175.60},{"Source":"300618","Target":"WEEKLY:AMOUNT:GE","Value":175.60},{"Source":"300618","Target":"WEEKLY:BIAS:GE","Value":175.60},{"Source":"300618","Target":"WEEKLY:BIAS:UC","Value":175.60},{"Source":"300618","Target":"WEEKLY:CCI:UC100","Value":175.60},{"Source":"300618","Target":"WEEKLY:CCI:GE100","Value":175.60},{"Source":"300618","Target":"WEEKLY:DMI:GE","Value":175.60},{"Source":"300618","Target":"WEEKLY:DMI:UC","Value":175.60},{"Source":"300618","Target":"WEEKLY:KD:GE","Value":175.60},{"Source":"300618","Target":"WEEKLY:MA:UC","Value":175.60},{"Source":"WEEKLY:MACD:GE","Target":"300618","Value":175.60},{"Source":"WEEKLY:MACD:UC","Target":"300618","Value":175.60},{"Source":"WEEKLY:MACD:UC0","Target":"300618","Value":175.60},{"Source":"WEEKLY:MACD:GE0","Target":"300618","Value":175.60},{"Source":"300618","Target":"MONTHLY:AMOUNT:GE","Value":175.60},{"Source":"300618","Target":"MONTHLY:BIAS:GE","Value":175.60},{"Source":"300618","Target":"MONTHLY:BIAS:UC","Value":175.60},{"Source":"300618","Target":"MONTHLY:CCI:NORMAL","Value":175.60},{"Source":"300618","Target":"MONTHLY:DMI:GE","Value":175.60},{"Source":"300618","Target":"MONTHLY:KD:GE","Value":175.60},{"Source":"300618","Target":"MONTHLY:KD:UC","Value":175.60},{"Source":"300618","Target":"MONTHLY:MA:UP","Value":175.60},{"Source":"MONTHLY:MACD:GE","Target":"300618","Value":175.60},{"Source":"MONTHLY:MACD:UC0","Target":"300618","Value":175.60},{"Source":"MONTHLY:MACD:GE0","Target":"300618","Value":175.60}]}

data 和 links

Echarts 里的桑基图相关推荐

【Echarts】渐变色桑基图
echarts 渐变色桑基图 let dataList8 = {total: "123",list: [[{target:'数据源-WAF'},{target:'数据源-IPS 1 ...
在线绘图|2分钟轻松搞定桑基图（Sankey diagrams）
桑基图(Sankey diagrams) 桑基图(Sankey diagrams),即桑基能量分流图,也叫桑基能量平衡图.用来展示数据的"流动"变化,分支的宽度表示流量的大小,应用 ...
什么是桑基图，桑基图又有什么作用？
桑基图 (Sankey Diagram)是用于描述一组值到另一组值的流向的图表. 最早由爱尔兰人Matthew Henry Phineas Riall Sankey 提出. Sankey是一名船长也是 ...
python桑基图教程_桑基图实例(Echarts版）
以前有看过桑基图的实例,但是一直没有实践过,最近在搞用户行为分析,想看看用户访问路径,一直没有一个很好的工具来展现.之前手工在思维导图的搞过,但是太费事了,这次想起了这个桑基图,想看看能不能实现想要的 ...
echarts 桑基图添加标志线问题
最近做一个项目,要求在桑基演化图的基础上添加"时间线",由于echart桑基图中没有该参数,所以需要两种图形叠加实现. 1.绘制基础桑基图 product.json {" ...
桑基图（Echarts）——自定义风格
桑基图绘制--使用Echarts 桑基图(Sankey diagram),即桑基能量分流图,也叫桑基能量平衡图.它是一种特定类型的流程图,图中延伸的分支的宽度对应数据流量的大小,通常应用于能源.材料成 ...
echarts 桑基图
使用echarts的桑基图时发现一个问题: 当一个流转状态的值比较大时且覆盖了其它的流转状态,那么这时鼠标移到这些值小的流转状态,tooltip提示出来的仍是那个大的流转状态,也就是选不中这些小的状态 ...
Echarts桑基图sankey点击高亮显示
Echarts桑基图sankey点击高亮显示 2022-02-21更新: 点击某一项将与其有关联的所有父项目和子项目全部高亮显示,并降低其他无关项目透明度,再次点击则恢复原有状态: 在线DEMO查看 ...
Echarts桑基图的排列顺序
首先我们来说几个关于echarts的参数配置项 layoutIterations,布局的迭代次数.官方的解释如下: 这个不配合图来看,还真有点懵. 意思就是,如果 layoutIterations=0 ...

Echarts 里的桑基图

Echarts 里的桑基图相关推荐

最新文章

热门文章