1.中间标题字体大小不一致(可分为一个title一个graphic)

2.labelLine与饼图分离(两个饼图,其中一个显示一个隐藏)

function setmyChartJsgxzq(arr,date) {
// 基于准备好的dom,初始化echarts实例
myChartJsgxzq = echarts.init(document.getElementById('jsgxzq'));
// 指定图表的配置项和数据
var option = {
color: moreColor,
dataset: {
source: arr
},
xAxis: {
axisLine: {
show: false
}
},
yAxis: {
axisLine: {
show: false
}
},
series: [{
name : 'show',
type: 'pie',
radius: ['43%', '60%'],
seriesLayoutBy: 'row',
label: {
normal: {
show: false,
color:'#000000'
},
}
},
{
name: 'hidden',
radius: ['60%', '63%'],
type: 'pie',
seriesLayoutBy: 'row',
itemStyle: {
opacity: 0,
},
label: {
normal: {
show: true,
color:'#000000'
},
},
labelLine:{
normal: {
lineStyle: {
color: '#000000'
},
show: true
}
}
}
],
title: {
text: '行业更新周期',
x: 'center',
y: '44%',
textStyle: {
fontWeight: 'normal',
fontSize: 14
}
},
graphic:{
type:'text',
left:'center',
top:'54%',
style:{
text:date,
textAlign:'center',
fill:'#000',
width:30,
fontSize:18,
// height:60
}
}
};
// 使用刚指定的配置项和数据显示图表。
myChartJsgxzq.setOption(option);
}

注:arr的数据格式为二维数组

eg:

arr = [
['1-3年','4-6年','7-9年','10-12年'],
[10,20,30,40]
];
date = '5年';

echarts饼图样式的更多相关文章

  1. ECharts饼图试玩

    处理类似提交问卷的数据,要生成图表,用了ECharts,好方便的. 简陋效果: 1.表单存储 有单选和多选题,单选直接存储各选项数字值,1,2,3,4...中一个:多选用|分隔存储选项值,如1|3,2 ...

  2. 将数据动态加载到Echarts饼图中

    需求描述 Echarts中的官方示例是将数据的设定写好在页面的配置项中的,但在实际的开发展示中,我们需要按照需求通过调用后台的接口获取数据,再将数据加载到特定的Echarts饼图中. 实现效果 实现步 ...

  3. Vue Echarts 饼图设置默认选中一个

    Vue Echarts 饼图设置默认选中一个 myChart.setOption(data) // data伟echarts所需要传入的参数,就是配置参数最多的那个玩意 myChart.dispatc ...

  4. echarts饼图配置

    js引用和配置div <div id="container" style="height: 100%"></div> <scrip ...

  5. ECharts饼图制作分析

    ECharts,缩写来自Enterprise Charts,商业级数据图表,一个纯Javascript的图表库,可以流畅的运行在PC和移动设备上,兼容当前绝大部分浏览器(IE6/7/8/9/10/11 ...

  6. ECharts饼图自定义

    [本文出自天外归云的博客园] 实现: 1.饼块可点击(点击饼块跳转到百度) 2.饼块自定义标签显示(显示个数.占比) 3.自定义标签连接线样式(虚线) 前端php代码如下: <!DOCTYPE ...

  7. Echarts饼图绘制

    实现效果: html代码: <div id="chartBody1" style="width:120%;height:28vh;"> <di ...

  8. echarts饼图

    1.添加点击事件并跳转到不同的页面 // 路径配置 require.config({ paths: { echarts: 'http://echarts.baidu.com/build/dist/' ...

  9. 百度ECHARTS 饼图使用心得 处理data属性

    做过CRM系统的童鞋应该都或多或少接触过hicharts或者echarts等数据统计插件.用过这两款,个人感觉echarts的画面更好看.至于功能,只有适合自己的才是最好的. 今天来说说我使用echa ...

随机推荐

  1. 从零开始搭建你的nvim ide

    前言概述 vim由于其丰富的扩展性.出色的跨平台性.高效率的操作性深受一大批粉丝的追捧,甚至就连vim和emacs之间孰优孰劣的话题都能被引起一场编辑器之间的圣战,足以见vim是多么的优秀. vim的 ...

  2. supervisor安装

    supervisor管理进程,是通过fork/exec的方式将这些被管理的进程当作supervisor的子进程来启动,所以我们只需要将要管理进程的可执行文件的路径添加到supervisor的配置文件中 ...

  3. KMP算法-字符匹配

    字符匹配模式-KMP算法 j直接跳到了2的位置,因为在之前的都相同. 那么就需要求如果不等了之后,j需要回跳的位置next[j] 如果tk'与tj相等,则next [j+1]=k'+1 如果tk'与t ...

  4. Intellij IDEA 配置Junit

    导包: 1.Hamcrest Core 包:    https://mvnrepository.com/artifact/org.hamcrest/hamcrest-core/1.3 2.Junit包 ...

  5. vi/vim 常用命令总结

    目录 Linux vi/vim编辑 vim键盘图 vim的三种模式 命令模式.输入模式.输出模式 vim使用实例 vi/vim按键说明 第一部分:一般模式可用的光标移动.复制粘贴.搜索替换等 第二部分 ...

  6. 性能优化 | Go Ballast 让内存控制更加丝滑

    关于 Go GC 优化的手段你知道的有哪些?比较常见的是通过调整 GC 的步调,以调整 GC 的触发频率. 设置 GOGC 设置 debug.SetGCPercent() 这两种方式的原理和效果都是一 ...

  7. 菜鸡的Java笔记 笔记

    // 雇员编号 姓名 职位 基本工资 佣金等信息 package study; class Enr{ private int number; // 编号 private String fullName ...

  8. Kubernetes 入门基础

    我们要学习 Kubernetes,就有首先了解 Kubernetes 的技术范围.基础理论知识库等,要学习 Kubernetes,肯定要有入门过程,在这个过程中,学习要从易到难,先从基础学习. 接下来 ...

  9. [atAGC048E]Strange Relation

    考虑对于$\{a_{i+1},...,a_{n}\}$,在其前面插入$a_{i}$对$x_{i}$的影响(不考虑$a_{1}$到$a_{i-1}$): 1.$x_{i}=0$,因为其前面没有数字了 2 ...

  10. 析构函数与this指针

    二.析构函数 1.知识点介绍 析构函数和构造函数一样,也是一种特殊的函数,主要的作用是在对象结束生命周期时,系统自动调用析构函数,来做一些清理工作,比如在对象中有申请内存,那么是需要自己去释放内存的, ...