正常饼图是鼠标移动到饼图上面显示数据,

现在可以直接显示在每块饼图变;

option = {

title : {
        text: '某站点用户访问来源',
        subtext: '纯属虚构',
        x:'center'
    },
    tooltip : {
        trigger: 'item',
        formatter: "{a} <br/>{b} : {c} ({d}%)"
    },
    legend: {
        orient: 'vertical',
        left: 'left',
        data: ['直接访问','邮件营销','联盟广告','视频广告','搜索引擎']
    },
    series : [
        {
            name: '访问来源',
            type: 'pie',

radius : '55%',

label: {
               normal: {
                   formatter: ' {b}:{c}  {d}%',//此处可以改变需要的样式
                   backgroundColor: '#eee',
                   borderColor: '#aaa',
                   borderWidth: 1,
                   borderRadius: 4,
                   rich: {
                       a: {
                           color: '#999',
                           lineHeight: 22,
                           align: 'center'
                       },
                     
                       hr: {
                           borderColor: '#aaa',
                           width: '100%',
                           borderWidth: 0.5,
                           height: 0
                       },
                       b: {
                           fontSize: 16,
                           lineHeight: 33
                       },
                       per: {
                           color: '#eee',
                           backgroundColor: '#334455',
                           padding: [2, 4],
                           borderRadius: 2
                       }
                   }
               }
           },

center: ['50%', '60%'],
            data:[
                {value:335, name:'直接访问'},
                {value:310, name:'邮件营销'},
                {value:234, name:'联盟广告'},
                {value:135, name:'视频广告'},
                {value:1548, name:'搜索引擎'}
            ],
            itemStyle: {
                emphasis: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                }
            }
        }
    ]
};

echart 饼图数据显示相关推荐

  1. 关于echart 饼图显示不出来 挖坑总结

    关于echart 饼图显示不出来 挖坑总结 近来公司的移动端app,作业页面,从后台接口返回的是:老师布置一次作业的所有题目信息,在app页面除了展示题目信息之外,还需要统计A\B\C\D,正确\错误 ...

  2. Echart饼图-圆形图修改重新绘制

    首先看看默认效果: 代码如下: option = {tooltip: {trigger: 'item'},legend: {top: '5%',left: 'center'},series: [{na ...

  3. 单击Echart饼图实现数据钻取

    使用场景和需求: 第一层饼图显示党员党龄分布的情况. 点击某个党龄段,查看拥有该党龄段的党支部. 默认显示3个党支部,余下的党支部合并为其它,点击其它,查看余下的党支部. 点击某个党支部,返回第一层饼 ...

  4. echart饼图标签重叠_怎么让ECharts饼图的label标签不重叠?

    1.怎么让ECharts饼图的label标签不重叠? 使用ECharts饼图,如果有的项目占比很小,饼图所占空间也比较小的时候,会出现label标签重叠.标签被截断的情况(图1). 可以通过设置rad ...

  5. echart饼图label超出绘图区域显示省略号

    最近在工作遇到这样一个问题,在绘制饼图时,由于label文字过长,而超出了canvas的绘图区域,导致超出的label直接被截掉.dalao要我帮忙看一下这个问题- 阐述问题: 就像正常的思路一样,用 ...

  6. echart 饼图设置指引线_EXCEL中把饼图砍一半,美观程度瞬间提升

    EXCEL中饼图是常用的图表之一,好多人也习惯了直接使用饼图.今天教给大家一个饼图的小技巧,我们只用一半饼图比整个饼图的效果要好很多,如下图是整个饼图和半饼图的对比情况. 这个半饼图是如何做出来的呢, ...

  7. echart饼图标签重叠_Echarts 解决饼图文字过长重叠的问题

    之前在网上查找了很多关于解决饼图文字描述过长导致重叠的问题,找了很多一直没有一个合适的解决方案,最后自己只能花时间研究echarts文档,功夫不负有心人,终于解决了文字重叠展示不全等问题. 废话不多说 ...

  8. echart 饼图设置指引线_表示整体和部分的条饼图,走起!|Excel144

    小伙伴们大家好,今天分享一个组合图的绘制技巧,表示整体和部分关系的条饼图. 效果如下图所示: 数据源如下图所示:左表中的[其它]包括右表中的全部项目,[其它]的金额总和等于右表所有项目的总和.具体操作 ...

  9. echart饼图标签重叠_解决echarts中饼图标签重叠的问题

    饼图中的series有个avoidLabelOverlap属性, avoidLabelOverlap:是否启用防止标签重叠策略,默认开启,在标签拥挤重叠的情况下会挪动各个标签的位置,防止标签间的重叠. ...

最新文章

  1. oracle acfs 快照,20C 新特性 ORACLE ACFS 基于文件的快照
  2. 数据中心规划设计中值得注意的八个问题
  3. Coursera ML笔记 - 神经网络(Learning)
  4. TF之AutoML之AdaNet框架:AdaNet框架的简介、特点、使用方法详细攻略
  5. sklearn自学指南(part19)--LDA和QDA
  6. 在Spring boot 配置过滤器(filter)
  7. android ListView实现下拉上拉刷新功能
  8. ibm mq的交互命令模式_IBM的完整形式是什么?
  9. 第十四天linux扩展知识点
  10. 设计模式——行为型模式
  11. Pano2VR热点热区热点替换
  12. 普拉提瑜伽工作室行业调研报告 - 市场现状分析与发展前景预测
  13. 【Matlab水果识别】RGB+HSV水果成熟度分级系统【含GUI源码 825期】
  14. 搭建WinDbg应用程序调试环境
  15. coreldraw水涟漪怎么做_巧用CorelDRAW X7制作波纹效果文字
  16. 【其它】怎样开启Win7快速启动栏
  17. Android shape画一个圆角虚线框
  18. 为什么将-Xms和-Xmx设置为相同的值?
  19. bigbrother的补充单节点hdfs搭建好后搭建mapredce
  20. 搜狗联盟开展“全民捉虫计划”打造诚信联盟

热门文章

  1. 异步调用案例_异步案例研究
  2. html5页面中添加腾讯地图api
  3. Java将图片压缩100KB以下,压缩图片,将几MB的图片压缩成100KB
  4. 给定两个有序整数数组 nums1 和 nums2,将 nums2 合并到 nums1 中,使得 num1 有序
  5. 超快自旋电子学为电子信息新材料开辟了道路
  6. 在键盘上输入两个int型数据,比较其大小,并输出其中较小的数
  7. 曾几何时,还是游吟长安的醉客
  8. 读《470个建筑设计创意发想》
  9. Creating schema using Saiku Schema Designer
  10. 解决android api30以上,调用华为P50相机,点击拍照无反应问题