alarmManage(){
let drawLine = echarts.init(document.getElementById('data-alarmManage-table-wrap'));
let option = null;
option = {
tooltip: {
trigger: 'item',
formatter: "{a} <br/>{b}: {c} ({d}%)"
},
legend: {
orient: 'vertical',
x: 'left',
y: '24%',
x: '40%',
itemHeight: 14,
itemWidth: 14,
textStyle: {
color: '#BBF6FF',
fontSize: 14
},
itemGap: 20,
data:['直接访问','邮件营销','联盟广告','','视频广告','搜索引擎','产品运营','','风控评估','算法投入']
},
color:["pink",'red','green','yellow','gray','purple','blue','wheat'],
icon: "rect",
series: [
{
center: ['25%','50%'],
name:'访问来源',
type:'pie',
radius: ['50%', '70%'],
avoidLabelOverlap: false,
label: {
normal: {
show: false,
position: 'center'
},
emphasis: {
show: true,
textStyle: {
fontSize: '14',
fontWeight: 'bold'
}
}
},
labelLine: {
normal: {
show: false
}
},
data:[
{value:335, name:'直接访问'},
{value:310, name:'邮件营销'},
{value:234, name:'联盟广告'},
{value:135, name:'视频广告'},
{value:148, name:'搜索引擎'},
{value:310, name:'产品运营'},
{value:234, name:'风控评估'},
{value:135, name:'算法投入'},
]
}
]
};
if (option && typeof option === "object") {
drawLine.setOption(option);
}
},

  

echarts画环形图的更多相关文章

  1. echarts实现环形图

    前端框架使用的angular,使用echarts实现环形图 1. item.component.html <div id="box1" class="pie&quo ...

  2. iOS 画环形图

    由于新项目的的需求,需要画环形图,由于以前都没接触过这一类(我是菜鸟),去cocochina山找到了一个案例,个人觉得还可以,分享一下 github 地址https://github.com/zhou ...

  3. 利用echarts自定义环形图

    一.代码 app.title = '通讯盒各版本用户占比'; option = { backgroundColor: '#0f0f31', title: { show:true, x:"le ...

  4. 修改echarts环形图的牵引线及文字位置

    修改echarts环形图的牵引线及文字位置,下面代码及效果不仅如此,也包含了其它的效果哦.有问题可以留言. 根据echarts官方示例修改效果: 官方示例图: 修改效果图: 直接上代码:其它不多说. ...

  5. vue 结合 Echarts 实现半开环形图

    Echarts 实现半开环形图 1.先看看实现的图 2.HTML部分 创建id 是 chart 的div标签. <div class="content-item"> & ...

  6. echarts白色实心环形图(空心饼图)的编写

    // 数据接入机构统计let myDom = document.getElementById('myChart');let myWidth = myDom.offsetWidth - 5; // 获取 ...

  7. WPF仿百度Echarts人口迁移图

    GitHub地址:https://github.com/ptddqr/wpf-echarts-map/tree/master 关于大名鼎鼎的百度Echarts我就不多说了 不了解的朋友直接看官方的例子 ...

  8. Vue中使用ECharts画散点图加均值线与阴影区域

    [本文出自天外归云的博客园] 需求 1. Vue中使用ECharts画散点图 2. 在图中加入加均值线 3. 在图中标注出阴影区域 实现 实现这个需求,要明确两点: 1. 知道如何在vue中使用ech ...

  9. 数据输入——生成你需要的echart图(堆积柱状图、扇形图、嵌套环形图)

    最近论文需要一些比较直观的图表, 发现echart做出来的图还是比较美观的,这里介绍如何修改数据生成你需要的echart图. 1.堆积柱状图: http://echarts.baidu.com/exa ...

随机推荐

  1. Linux 后台执行python或者java代码的命令

    1.nohup 命令操作后台执行程序 后台启动 nohup python app.py params1 > nohup.out >& & 查看后台进程启动 jobs -l ...

  2. linux ftp使用相关

    ftp 7.7.6.201 21121 name:aaa password:123456

  3. kubeadm初始化kubernetes集群

    有两种方式安装集群: 1.手动安装各个节点的各个组件,安装极其复杂困难. 2.使用工具:kubeadm kubeadm 是官方提供的专门部署集群的管理工具. 1. 在kubeadm下每个节点都需要安装 ...

  4. Dubbo 序列化协议 5 连问,你接得住不?

    1)dubbo 支持哪些通信协议? 2)支持哪些序列化协议? 3)说一下 Hessian 的数据结构? 4)PB 知道吗? 5)为什么 PB 的效率是最高的? 面试官心理分析 上一个问题,说说 dub ...

  5. BZOJ 4033: [HAOI2015]树上染色题解

    BZOJ 4033: [HAOI2015]树上染色题解(树形dp) 标签:题解 阅读体验:https://zybuluo.com/Junlier/note/1327400 原题地址: BZOJ 403 ...

  6. iconv编码转换报错问题

    今天,再由ISO-8859编码格式转化为UTF-8格式过程中,出现报错:iconv: 未知 10304 处的非法输入序列. 问题分析:ISO-8859是英文格式的编码方式,不支持中文,为了解决中文支持 ...

  7. PY个快速模

    既然这道题是数学题,那就用 PY 吧! 学点东西: print 可以和 c++ 中的 printf 一样快乐的输出格式 另外一点: 这道题可能数据不够强?想想应该有一个 \(0^0 ~\%~ k =0 ...

  8. 解决Java线程池任务执行完毕后线程回收问题

      转载请注明出处:http://www.cnblogs.com/pengineer/p/5011965.html         对于经常使用第三方框架进行web开发的程序员来说,Java线程池理所 ...

  9. 204-基于Xilinx Virtex-6 XC6VLX240T 和TI DSP TMS320C6678的信号处理板

    基于Xilinx Virtex-6 XC6VLX240T 和TI DSP TMS320C6678的信号处理板 1.板卡概述  板卡由我公司自主研发,基于VPX架构,主体芯片为两片 TI DSP TMS ...

  10. Linux包安装及搭建服务

    IP地址:以·分隔成4部分,每部分在底层是以8位二进制存储 例:172.16.45.10/16(后面是子网掩码,表示网络地址是前面16位二进制) 网路地址:172.16.00 主机地址:172.16. ...