饼图的实现
2021/10/5 6:14:01
本文主要是介绍饼图的实现,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
一、基本实现(不需要直角坐标系)
1、数据准备
series:[{ type: 'pie', data:[ {name:'淘宝',value:1123}, {name:'京东',value:656}, {name:'唯品会',value:1634} ]
2、图表类型
series:[{ type: 'pie'
二、常见效果
1、显示数值
series:[{ label:{//饼图文字的显示 show:true, formatter:function(arg){ let {name,value,percent} = arg }
2、圆环的设置
series:[{ //radius:20//半径 //radius:'20%'//百分比参照echart图的宽高较小者的一半 radius:['50%','75%']
3、南丁格尔图(半径不一样)
series:[{ roseType:'radius'
4、选中效果(选中的区域偏离圆点一小段距离)
series:[{ selectedMode:'single',//multiple selectedOffset: 30//偏离距离
这篇关于饼图的实现的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-11-23Springboot应用的多环境打包入门
- 2024-11-23Springboot应用的生产发布入门教程
- 2024-11-23Python编程入门指南
- 2024-11-23Java创业入门:从零开始的编程之旅
- 2024-11-23Java创业入门:新手必读的Java编程与创业指南
- 2024-11-23Java对接阿里云智能语音服务入门详解
- 2024-11-23Java对接阿里云智能语音服务入门教程
- 2024-11-23JAVA对接阿里云智能语音服务入门教程
- 2024-11-23Java副业入门:初学者的简单教程
- 2024-11-23JAVA副业入门:初学者的实战指南