今天做页面的时候用到了环状饼图,大家都知道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画饼环状饼图相关参数配置的更多相关文章

  1. 电机噪声之谐波分析(内附simulink中FFT分析的相关参数配置与解析)

    电机噪声之谐波分析(内附simulink中FFT分析的相关参数配置与解析) 目录 电机噪声之谐波分析(内附simulink中FFT分析的相关参数配置与解析) 写在前面 正文 电机噪声 谐波的产生 什么 ...

  2. 转:浅谈UNIX下Apache的MPM及httpd.conf配置文件中相关参数配置

    为什么要并发处理 以Apache为代表的web服务器中,如果不支持并发,则在一个客户端连接的时候,如果该客户端的任务没有处理完,其他连接的客户端将会一直处于等待状态,这事不可想象的,好像没有为什么要不 ...

  3. JVM相关参数配置和问题诊断<转>

    原文连接:http://blog.csdn.net/chjttony/article/details/6240457 1.Websphere JVM相关问题诊断: 由JVM引起的Websphere问题 ...

  4. Spark 性能相关参数配置详解-任务调度篇

    随着Spark的逐渐成熟完善, 越来越多的可配置参数被添加到Spark中来, 本文试图通过阐述这其中部分参数的工作原理和配置思路, 和大家一起探讨一下如何根据实际场合对Spark进行配置优化. 由于篇 ...

  5. Spark 性能相关参数配置详解-压缩与序列化篇

    随着Spark的逐渐成熟完善, 越来越多的可配置参数被添加到Spark中来, 本文试图通过阐述这其中部分参数的工作原理和配置思路, 和大家一起探讨一下如何根据实际场合对Spark进行配置优化. 由于篇 ...

  6. vue中使用echarts画饼状图

    echarts的中文文档地址:https://echarts.baidu.com/tutorial.html#5%20%E5%88%86%E9%92%9F%E4%B8%8A%E6%89%8B%20EC ...

  7. Yarn 内存分配管理机制及相关参数配置

    上一篇hive on tez 任务报错中提到了containter内存不足,现对yarn 内存分配管理进行介绍 一.相关配置情况 关于Yarn内存分配与管理,主要涉及到了ResourceManage. ...

  8. YARN日志聚合相关参数配置

    日志聚合是YARN提供的日志中央化管理功能,它能将运行完成的Container/任务日志上传到HDFS上,从而减轻NodeManager负载,且提供一个中央化存储和分析机制.默认情况下,Contain ...

  9. Spark 性能相关参数配置详解-shuffle篇

    随着Spark的逐渐成熟完善, 越来越多的可配置参数被添加到Spark中来, 在Spark的官方文档http://spark.apache.org/docs/latest/configuration. ...

随机推荐

  1. git将本地项目上传码云

    1.首先在码云新建项目. 2.使用git bash工具,进入本地项目所在的文件夹. 3.执行命令 git init,初始化本地git仓库 4.执行命令 git remote add [short-na ...

  2. JavaScript test() 方法

    JavaScript test() 方法 JavaScript RegExp 对象 定义和用法 test() 方法用于检测一个字符串是否匹配某个模式. 语法 RegExpObject.test(str ...

  3. 浅谈HTTP中GET、POST用法以及它们的区别

    浅谈HTTP中GET.POST用法以及它们的区别 HTTP定义了与服务器交互的不同方法,最基本的方法有4种,分别是GET,POST,PUT,DELETE.URL全称是资源描述符.我们可以这样认为: 一 ...

  4. visualSFM

    Ubuntu18.04配置VisualSFM参考:https://www.jianshu.com/p/cc0b548313e9 VisualSFM有GPU和NO_GPU两个版本,本文安装VisualS ...

  5. 数组中的stdClass Object如何访问

    使用print_r($data)输出结果为 Array ( [0] => stdClass Object ( [color_item_no] => 1 [color_name] => ...

  6. Qt下拉对话框 ComboBox的用法

    介绍 ComboBox是Qt的下拉菜单的一个控件,通过下拉菜单选择不同的选项,样式如图: 基本用法 m_ComBox = ui.comboBox; //设置默认显示值的索引,从0开始 m_ComBox ...

  7. 1.6 安全认证与授权(springboot与安全)

    引言:以下文档是学习尚硅谷关于springboot教学视频后整理而来! 一.安全 认证(Authentication):证明你是谁? 授权(Authorization):你能干什么? 参考资料: Sp ...

  8. Kotlin 基础语法

    Kotlin 文件以 .kt 为后缀. 包声明 代码文件的开头一般为包的声明: package com.runoob.main import java.util.* fun test() {} cla ...

  9. Linux下执行.sh命令出现-bash: ./bin/start.sh: /bin/bash^M: bad interpreter: No such file or directory

    原因是 文件的格式是dos,修改为unix 就OK了 查看文件格式  用vim 打开出错的文件    按 ESC键     再按shift+冒号   输入 set  ff  回车   可以看见 该文件 ...

  10. django之admin管理工具

    admin组件 admin是django提供的基于web的管理工具 >如何使用: 1.激活管理工具 通常会在生成项目时在urls.py中自动设置好 from django.urls import ...