echarts画饼环状饼图相关参数配置
今天做页面的时候用到了环状饼图,大家都知道echarts的API文档看起来实在费劲,折腾了半天才画出来我想要的饼图,把我用到的参数配置分享给大家,希望能帮到和我一样的对echarts不是那么熟悉的童鞋。直接上代码:
var option = {
series: [
{
type:'pie',
// 第一个参数是内圆半径,第二个参数是外圆半径,相对饼图的宿主div大小
radius: ['40%', '50%'],
avoidLabelOverlap: false,
// 禁用饼状图悬浮动画效果
animation: false,
label: {
normal: {
// 这里的竖线前面的b 和 per是相应参数的别名(我理解为别名),对应下面rich属性里的b和per
formatter: '{b|{b}:}{c} ({per|{d}%})',
backgroundColor: '#eee',
borderColor: '#aaa',
borderWidth: 1,
padding: 5,
borderRadius: 4,
rich: {
b: {
fontSize: 8,
lineHeight: 15
},
per: {
align: 'center'
}
}
}
},
data:[
{value:1432, name:'合格'},
{value:500, name:'不合格'}
]
}
]
}
大体效果是这样的:

比较简陋,如有错误,欢迎指正!!
echarts画饼环状饼图相关参数配置的更多相关文章
- 电机噪声之谐波分析(内附simulink中FFT分析的相关参数配置与解析)
电机噪声之谐波分析(内附simulink中FFT分析的相关参数配置与解析) 目录 电机噪声之谐波分析(内附simulink中FFT分析的相关参数配置与解析) 写在前面 正文 电机噪声 谐波的产生 什么 ...
- 转:浅谈UNIX下Apache的MPM及httpd.conf配置文件中相关参数配置
为什么要并发处理 以Apache为代表的web服务器中,如果不支持并发,则在一个客户端连接的时候,如果该客户端的任务没有处理完,其他连接的客户端将会一直处于等待状态,这事不可想象的,好像没有为什么要不 ...
- JVM相关参数配置和问题诊断<转>
原文连接:http://blog.csdn.net/chjttony/article/details/6240457 1.Websphere JVM相关问题诊断: 由JVM引起的Websphere问题 ...
- Spark 性能相关参数配置详解-任务调度篇
随着Spark的逐渐成熟完善, 越来越多的可配置参数被添加到Spark中来, 本文试图通过阐述这其中部分参数的工作原理和配置思路, 和大家一起探讨一下如何根据实际场合对Spark进行配置优化. 由于篇 ...
- Spark 性能相关参数配置详解-压缩与序列化篇
随着Spark的逐渐成熟完善, 越来越多的可配置参数被添加到Spark中来, 本文试图通过阐述这其中部分参数的工作原理和配置思路, 和大家一起探讨一下如何根据实际场合对Spark进行配置优化. 由于篇 ...
- vue中使用echarts画饼状图
echarts的中文文档地址:https://echarts.baidu.com/tutorial.html#5%20%E5%88%86%E9%92%9F%E4%B8%8A%E6%89%8B%20EC ...
- Yarn 内存分配管理机制及相关参数配置
上一篇hive on tez 任务报错中提到了containter内存不足,现对yarn 内存分配管理进行介绍 一.相关配置情况 关于Yarn内存分配与管理,主要涉及到了ResourceManage. ...
- YARN日志聚合相关参数配置
日志聚合是YARN提供的日志中央化管理功能,它能将运行完成的Container/任务日志上传到HDFS上,从而减轻NodeManager负载,且提供一个中央化存储和分析机制.默认情况下,Contain ...
- Spark 性能相关参数配置详解-shuffle篇
随着Spark的逐渐成熟完善, 越来越多的可配置参数被添加到Spark中来, 在Spark的官方文档http://spark.apache.org/docs/latest/configuration. ...
随机推荐
- java基础语法2.
第二章 2.1 class文件的生成 java文件为源代码文件 class为程序. class文件实时修改. eclipse自动生成. project下面clean. 2.2 jar文件 如何将有用的 ...
- 线上问题排查(2)——JDK内置工具
https://www.cnblogs.com/keanuyaoo/p/3253663.html 常用命令目录: jps命令(Java Virtual Machine Process Status T ...
- Linux 常用命令——文件处理命令
Linux 常用命令 Linux Linux命令格式 命令格式:命令 [-选项] [参数] 例如:ls -a /etc 说明: 1.当有多个选项时,可以写在一起 2.简化选项等于完整选项 -a = - ...
- JS开发工具WebStorm使用快捷键
快捷键可以提高开发效率,最好用的就是这些! 代码编辑 Ctrl + d 复制整行 Ctrl + '-/+' 模块折叠 Ctrl + [ ] 括号匹配 Ctrl + F12 结构展示 Shif ...
- K8S中如何跨namespace 访问服务?为什么ping不通ClusterIP?
1.K8S中如何跨namespace 访问服务? 2.在Pod中为什么ping不通ClusterIP? 简述: Rancher2.0中的一个用户,在K8S环境中,创建两个namespace,对应用进行 ...
- js时间戳转化成日期格式
function timestampToTime(timestamp) { var date = new Date(timestamp * 1000);//时间戳为10位需*1000,时间戳为13位的 ...
- mongodb笔记(三)
1.删除文档(remove()函数) 在执行remove()函数前先执行find()命令来判断执行的条件是否正确,这是一个比较好的习惯. 语法: db.collection.remove( <q ...
- 搭建openstf平台的那些事
最近老板建议秀下肌肉,搭建一个STF android 真机测试平台,记录一下坑. 1. stf 是node开发的,通过npm即可安静,依赖的数据库是rethinkdb, 如果搭配appium效果更佳, ...
- java基础---->Serializable的使用
本次讲解中我们建立一个Java的项目去体会一下序列化Serializable的使用,序列化的原理以及序列化的自定义请参见我的另外一篇博客(java高级---->Serializable序列化的源 ...
- 【lintcode17/18】Subset, SubsetII
题目:给定一个含不同整数的集合,返回其所有的子集. 样例:如果 S = [1,2,3],有如下的解:[[3],[1],[2],[1,2,3],[1,3],[1,2],[2,3],[]] 思路:因为此题 ...