echart 桑基图操作事项
例图

注意:
option = {
label:{//formatter名字
show:true,
formatter:function(obj){
return obj.data.name+'_123'
}
},
tooltip: {
//可以自行添加,默认不添加
},
series: {
type: 'sankey',
layout:'none',
focusNodeAdjacency: 'allEdges',
data: [{
name: 'a',
value:11
}, {
name: 'b'
}, {
name: 'a1'
}, {
name: 'a2'
}, {
name: 'b1'
}, {
name: 'c'
}],
links: [{
source: 'a',
target: 'a1',
value: 5
}, {
source: 'a',
target: 'a2',
value: 3
}, {
source: 'b',
target: 'b1',
value: 8
}, {
source: 'a',
target: 'b1',
value: 3
}, {
source: 'b1',
target: 'a1',
value: 1
}, {
source: 'b1',
target: 'c',
value: 2
}]
}
};
注意事项:
series。data和link里面的名称不能有重复的否则会报错
详细参照文章 里面demo4页面
echart 桑基图操作事项的更多相关文章
- vue项目中基于D3.js实现桑基图功能
前端实现数据可视化的方案有很多种,以前都是使用百度的echarts,使用起来很方便,直接按照特定的数据格式输入,就能实现相应的效果,虽然使用方便,但是缺点就是无法自定义一些事件操作,可自由发挥的功能很 ...
- python可视化动态图表: 关于pyecharts的sankey桑基图绘制
最近因工作原因,需要处理一些数据,顺便学习一下动态图表的绘制.本质是使具有源头的流动信息能够准确找到其上下级关系和流向. 数据来源是csv文件 导入成为dataframe之后,列为其车辆的各部件供应商 ...
- ggalluvial|TCGA临床数据绘制桑基图(Sankey)
本文首发于”生信补给站“,https://mp.weixin.qq.com/s/yhMgkST-rVD6SaQS7R-eoA 桑基图(Sankey diagram),是一种特定类型的流程图,图中延伸的 ...
- 图解微信小程序---添加tabBar底部菜单,添加已做好轮播图操作
图解微信小程序---添加tabBar底部菜单,添加已做好轮播图操作 什么是tabBar? 顶部或者底部tab栏如果小程序是一个多 tab 应用(客户端窗口的底部或顶部有 tab 栏可以切换页面),可以 ...
- 数据可视化:Echart中k图实现动态阈值报警及实时更新数据
1 目标 使用Echart的k图展现上下阈值,并且当真实值超过上阈值或低于下阈值时候,标红报警. 2 实现效果 如下:
- 第七节,TensorFlow编程基础案例-TensorBoard以及常用函数、共享变量、图操作(下)
这一节主要来介绍TesorFlow的可视化工具TensorBoard,以及TensorFlow基础类型定义.函数操作,后面又介绍到了共享变量和图操作. 一 TesnorBoard可视化操作 Tenso ...
- echart折线区域图
在引入echart区域折线图时,没有出现对应的区域图 当发现引入下面代码到自己的代码中并没有对应的区域图 option = { xAxis: { type: 'category', boundaryG ...
- 使用echart的雷达图的时候,如果文字越界的解决办法记录,标签文字自动换行
使用echart的雷达图的时候,如果文字越界的解决办法记录,标签文字自动换行 前几天项目中有一个图表的是用echart生成的,遇到一个问题,就是在手机端显示的售时候,如果文字太长就会超出div,之前的 ...
- React中用EChart写面积图
UED出的设计图如下: 实际展示效果如下: 调取的数据如下: "staffCountList":[ { "time":"2019-12-24 17: ...
随机推荐
- day04(权限修饰符,内部类,局部内部类,匿名内部类)
权限修饰符, Public >protected >default > private public 公共权限 随便都可以访问 protected 子类可以访问权限 (子类 ...
- ScrollView嵌套listview ,滚动问题。设置listview不滚动
对于ListView内部的ListView,一般用来展示少量的列表数据. 内部的ListView的高度看起来是一个固定值且无法滑动,这个就比较蛋疼了.. 提供两种解决方案,方案的核心都是重新设置内部L ...
- shell 脚本 计算 1加到100 的和
#!/bin/bash # i=0 n=1 //定义循环变量 while [ $n -lt 101 ];do //定义循环条件 n < 101 i=$(( $i + $n )) //累加 n=$ ...
- hdu 5011 Nim+拿完分堆
http://acm.hdu.edu.cn/showproblem.php?pid=5011 有N堆珠子,两个人轮流拿,最少拿一个,可以全拿,每次只能从一个堆里拿,不能从多堆同时拿:拿完之后该人还有一 ...
- jsp ckeditor ckfinder
我认为对的事情,有可能是完全错的. 这篇教程很好: http://www.cnblogs.com/yuepeng/archive/2013/04/01/2992097.html 只看到9,权限控制还没 ...
- leanCloud 笔记
目的:javascript实时通讯.感觉:nodejs的socket.io加了一个图形界面和接口,它保证了所有环境下的实时通信. 最新版leancloud支持的服务:实时消息推送,实时点对点消息服务. ...
- Mysql工作記錄之修改默認存儲引擎及重設root用戶密碼
1>修改默認存儲引擎方法 修改配置文件,然後重啟mysql服務: [root@CHW mysql]# cat /etc/my.cnf [my ...
- Intellij IDEA 14的注册机(Java版)
import java.math.BigInteger; import java.util.Date; import java.util.Random; import java.util.zip.CR ...
- Delphi事件的广播 转
http://blog.sina.com.cn/s/blog_44fa172f0102wgs2.html 原文地址:Delphi事件的广播 转作者:MondaySoftware 明天就是五一节了,辛苦 ...
- C# 生产成条形码3种方法
首先效果: 1:首先下载BarcodeLib.dll 下载地址 http://pan.baidu.com/share/link?shareid=2590968386&uk=2148890391 ...