博客
关于我
百度echart绘制圆环
阅读量:131 次
发布时间:2019-02-26

本文共 2858 字,大约阅读时间需要 9 分钟。

效果图

一、代码封装

var pie = function (options) {       var option = {        backgroundColor: "#fff",        //不显示标题        title: {            show: false,            text: options.title,            textStyle: {                fontSize: 24 * iWidth / 720,                color: "#36383c",                fontWeight: "normal",                fontFamily: "Microsoft Yahei"            },            left: 20 * iWidth / 720,            top: 20 * iWidth / 720,        },        grid: {            top: 0 * iWidth / 720,            left: '50%',            right: '50%',            bottom: 45 * iWidth / 720        },        //鼠标放上去提示        // tooltip: {           //     trigger: 'item',        //     formatter: "{a} 
{b}: {c} ({d}%)" // }, legend: { orient: 'vertical', left: 180 * iWidth / 720, top: "middle", icon: 'circle', itemGap: 20 * iWidth / 720, textStyle: { fontSize: 16 * iWidth / 720, color: "#91989e", fontWeight: "normal", fontFamily: "Microsoft Yahei" }, //图例不能点击 selectedMode: false, data: options.legendData }, series: [ { name: '访问来源', type: 'pie', center: ["28%", "50%"], radius: [54 * iWidth / 720, 70 * iWidth / 720], top: "50%", avoidLabelOverlap: false, label: { normal: { show: false, position: 'center' }, //鼠标移上去中间显示文字 emphasis: { show: false, textStyle: { fontSize: 30 * iWidth / 720, color: "#91989e", fontWeight: "normal", fontFamily: "Microsoft Yahei" } } }, labelLine: { normal: { show: false } }, data: [], } ] }; //如果是大图设置样式 if(options.isBig){ option.legend.left = 300 * iWidth / 720; } //重组数据 (function () { options.seriesData.map(function (item, index) { option.series[0].data.push({ value: item.value, name: item.name, itemStyle: { normal: { color: colorGroup[index % colorGroupLen], //中间间隔 borderColor: '#fff', borderType: 'solid', borderWidth: 5 } } }) }) })(); return option;}
你可能感兴趣的文章
Mysql中怎样设置指定ip远程访问连接
查看>>
mysql中数据表的基本操作很难嘛,由这个实验来带你从头走一遍
查看>>
Mysql中文乱码问题完美解决方案
查看>>
mysql中的 +号 和 CONCAT(str1,str2,...)
查看>>
Mysql中的 IFNULL 函数的详解
查看>>
mysql中的collate关键字是什么意思?
查看>>
MySql中的concat()相关函数
查看>>
mysql中的concat函数,concat_ws函数,concat_group函数之间的区别
查看>>
MySQL中的count函数
查看>>
MySQL中的DB、DBMS、SQL
查看>>
MySQL中的DECIMAL类型:MYSQL_TYPE_DECIMAL与MYSQL_TYPE_NEWDECIMAL详解
查看>>
MySQL中的GROUP_CONCAT()函数详解与实战应用
查看>>
MySQL中的IO问题分析与优化
查看>>
MySQL中的ON DUPLICATE KEY UPDATE详解与应用
查看>>
mysql中的rbs,SharePoint RBS:即使启用了RBS,内容数据库也在不断增长
查看>>
mysql中的undo log、redo log 、binlog大致概要
查看>>
Mysql中的using
查看>>
MySQL中的关键字深入比较:UNION vs UNION ALL
查看>>
mysql中的四大运算符种类汇总20多项,用了三天三夜来整理的,还不赶快收藏
查看>>
mysql中的字段如何选择合适的数据类型呢?
查看>>