var data = [{
"name": "1",
"value": 54
}, {
"name": "2",
"value": 10
}, {
"name": "3",
"value": 10
},
{
"name": "4",
"value": 10
},
{
"name": "5",
"value": 120,
label: {
normal: {
show: false
}
},
itemStyle: {
normal: {
label: {
show: false
},
labelLine: {
show: false
},
color: 'rgba(0, 0, 0, 0)',
borderColor: 'rgba(0, 0, 0, 0)',
borderWidth: 0
}
}
}] var data1 = [{
"name": "1",
"value": 0
},
{
"name": "2",
"value": 0
},
{
"name": "3",
"value": 0
},
{
"name": "4",
"value": 0
},
{
"name": "5",
"value": 0
},
{
"name": "6",
"value": 54, }] option = { color: ['#A0CE3A', '#31C5C0', '#1E9BD1','#149BD1', 'transparent',"#ffffff"],
backgroundColor: 'rgba(225,225,225,0.7)',
title: {
text: '松鼠',
subtext: 7789,
textStyle: {
color: '#000000',
fontSize: 20,
// align: 'center'
},
subtextStyle: {
fontSize: 30,
color: ['#ff9d19']
},
x: 'center',
y: 'center',
},
grid: {
bottom: 150,
left: 100,
right: '10%'
},
tooltip: {
show:true,
trigger: 'item',
formatter: function(params){
if(params.dataIndex === 4){
//剔除总数据,避免鼠标移上的bug
return '';
}else{
// '{b}:{c}({d})%'
return params.data.name+":"+params.data.value;
}
},
textStyle:{
fontSize:12
} },
legend: {
show:false,
data: data,
},
series: [
// 主要展示层的
{
radius: ['30%', '61%'],
center: ['50%', '50%'],
type: 'pie',
label: {
normal: {
show: true,
formatter: "{c}",
textStyle: {
fontSize: 12, },
position: 'inside'
},
emphasis: {
show: false
}
},
name: "民警训练总量",
data: data,
startAngle:80, //起始角度
},
{
radius: ['0', '30%'],
center: ['50%', '50%'],
label: {
normal: {
show: false,
},
emphasis: {
show: false
}
},
type: 'pie',
data: data1,
startAngle:80, //起始角度
} ]
}; /*暂时未使用*/
function _colors() {
return [
new this.echarts.graphic.LinearGradient(0, 0, 0, 1,
[
{ offset: 0, color: '#d4a26a' }, // 0% 处的颜色
{ offset: 1, color: '#dec399' } // 100% 处的颜色
],
false),
new this.echarts.graphic.LinearGradient(0, 0, 0, 1,
[
{ offset: 0, color: '#588ec5' }, // 0% 处的颜色
{ offset: 1, color: '#93bbd8' } // 100% 处的颜色
],
false),
new this.echarts.graphic.LinearGradient(0, 0, 0, 1,
[
{ offset: 0, color: '#72ede0' }, // 0% 处的颜色
{ offset: 1, color: '#02758a' } // 100% 处的颜色
],
false),
new this.echarts.graphic.LinearGradient(0, 0, 0, 1,
[
{ offset: 0, color: '#db4bb4' }, // 0% 处的颜色
{ offset: 1, color: '#85035f' } // 100% 处的颜色
],
false),
new this.echarts.graphic.LinearGradient(0, 0, 0, 1,
[
{ offset: 0, color: '#edd099' }, // 0% 处的颜色
{ offset: 1, color: '#ffa13c' } // 100% 处的颜色
],
false),
new this.echarts.graphic.LinearGradient(0, 0, 0, 1,
[
{ offset: 0, color: '#5df5af' }, // 0% 处的颜色
{ offset: 1, color: '#1a8764' } // 100% 处的颜色
],
false),
new this.echarts.graphic.LinearGradient(0, 0, 0, 1,
[
{ offset: 0, color: '#53b1d9' }, // 0% 处的颜色
{ offset: 1, color: '#023f8a' } // 100% 处的颜色
],
false),
new this.echarts.graphic.LinearGradient(0, 0, 0, 1,
[
{ offset: 0, color: '#db8fe6' }, // 0% 处的颜色
{ offset: 1, color: '#af44e6' }, // 100% 处的颜色
],
false),
new this.echarts.graphic.LinearGradient(0, 0, 0, 1,
[
{ offset: 0, color: '#fa864c' }, // 0% 处的颜色
{ offset: 1, color: '#aa3815' } // 100% 处的颜色
],
false),
new this.echarts.graphic.LinearGradient(0, 0, 0, 1,
[
{ offset: 0, color: '#b4dbf6' }, // 0% 处的颜色
{ offset: 1, color: '#3c9cff' } // 100% 处的颜色
],
false)
];
}

  

 实例展示地址:  https://gallery.echartsjs.com/editor.html?c=xnNT33748W

ecahrt 扇形(半扇形)的更多相关文章

  1. android自定义控件一站式入门

    自定义控件 Android系统提供了一系列UI相关的类来帮助我们构造app的界面,以及完成交互的处理. 一般的,所有可以在窗口中被展示的UI对象类型,最终都是继承自View的类,这包括展示最终内容的非 ...

  2. RabbitMQ入门教程——发布/订阅

    什么是发布订阅 发布订阅是一种设计模式定义了一对多的依赖关系,让多个订阅者对象同时监听某一个主题对象.这个主题对象在自身状态变化时,会通知所有的订阅者对象,使他们能够自动更新自己的状态. 为了描述这种 ...

  3. ANDROID——仿360手机卫士的旋转打分控件

    转载请注明本文出自大苞米的博客(http://blog.csdn.net/a396901990),谢谢支持! 简介 灵感源自360手机卫,主要功能就是实现显示评分或等级的效果.并稍微改良了一下,有更好 ...

  4. C#中的GDI+图形绘制方法

    GDI+图形绘制方法 1.首先对于绘制图形,必须的先将命名空间导入:using System.Drawing.Drawing2D; 2.然后在一个事件中写入程序 首先先将Graphics这个对象实例化 ...

  5. [游戏模版6] Win32 graph

    >_<:there in the MyPaint(...) function respectively use Ellipse(...) draw ellipse, use RoundRe ...

  6. Quartz2D简介及基本线条绘制

    * Quartz2D简介 1.什么是Quartz2D? 他是一个二维的绘图引擎,同时支持iOS和Mac系统 2.Quartz2D能完成的工作 画基本线条,绘制文字,图片,截图,自定义UIView. 3 ...

  7. 004--VS C++ 绘制封闭图形

    //全局变量HPEN hPen;HBRUSH hBru[4];int sBru[4] = { HS_VERTICAL, HS_HORIZONTAL, HS_CROSS, HS_DIAGCROSS }; ...

  8. GDI编程

    图形设备接口(GDI)是一个可执行程序,它接受Windows应用程序的绘图请求(表现为GDI函数调用),并将它们传给相应的设备驱动程序,完成特定于硬件的输出,象打印机输出和屏幕输出.GDI负责Wind ...

  9. iOS - Quartz 2D 二维绘图

    1.Quartz 2D 简介 Quartz 2D 属于 Core Graphics(所以大多数相关方法的都是以 CG 开头),是 iOS/Mac OSX 提供的在内核之上的强大的 2D 绘图引擎,并且 ...

随机推荐

  1. Installation failed with message Failed to finalize session : INSTALL_FAILED_INVALID_APK: Split lib_slice_8_apk was defined multiple times. It is possible that this issue is resolved by uninstalling a

    取消:Instant Run就行

  2. linux系统构架 - LB集群之LVS介绍

    LB 集群是 load balance 集群的简写,翻译成中文就是负载均衡集群.常用的负载均衡开源软件有 nginx.lvs.keepalived ,商业的硬件负载设备 F5.Netscale. LB ...

  3. 解决Tomcat 一闪而过的问题

    启动tomcat时cmd窗口一闪而过解决方法. 问题现象: 在实际开发中一般都是eclipse+tomcat(也许还会用到tomcat的插件),我们只需要在eclipse中单击servers上的按钮就 ...

  4. centos7 yum 安装jq

    一.简介 EPEL是企业版 Linux 附加软件包的简称,EPEL是一个由Fedora特别兴趣小组创建.维护并管理的,针对 红帽企业版 linux(RHEL)及其衍生发行版(比如 CentOS.Sci ...

  5. go反射实例

    需求分析: 如在rocketmq的网络通信中,所有通信数据包以如下形式传输: (注:rocketmq的java结构体,这里使用了go形式表示) type RemotingCommand struct ...

  6. BarcodeLib -- 一个精简而不失优雅的条形码生成库

    BarcodeLib -- 一个精简而不失优雅的条形码生成库 引言 在百度进行“C# 条形码”等类似关键字搜索的时候,基本上是使用 ZXing 类库进行条形码的生成.今天我所介绍的是另一款类库 Bar ...

  7. Library not found for -lAPOpenSdk

    多人开发合作的时候 总是会遇见各种各样的问题 今天就来讲一个关于友盟的问题 在我的小伙伴 用cocoapods 中添加了这样一句话 pod ‘UMengSocialCOM’,  并且pod updat ...

  8. [转]NDK编译库运行时报dlopen failed: cannot locate symbol "__exidx_end" 解决办法

    原文链接:http://blog.csdn.net/acm2008/article/details/41040015 当用NDK编译的库在运行加载时报如下错: dlopen("/data/d ...

  9. [C++] Memory_stack_heap

    STACK_HEAP_MEMERY_MAP NOTICE: For p1 , where is the address of p1 ?(0x200400) IN STACK For p1 , wher ...

  10. linux的“自动化”-乾颐堂CCIE

    linux系统的web网站在运营状态时,我们常需要对网站进行维护,例如查看资源剩余并做出响应.日志分割.数据整理,在特定状态执行特定任务等等,这些都会需要linux能实现自动执行某些任任务.本篇博文介 ...