zoukankan      html  css  js  c++  java
  • echart 饼图图例legend支持滑动

    ps: 以下针对option操作

    文章目录

    图例过多加上滚动条
    图例形状
    图例自定义显示
    图例过多加上滚动条

     

    legend:{
    top:'50',
    bottom:'50',
    type:'scroll',
    }

    避免可能出现的翻页下标错乱,加上间距top / bottom属性

    图例形状

     

    legend:{
    data:legeData
    }


    legeData=[{name:'xx',value:100,icon:'circle'}];

    其他扩展
    http://echarts.baidu.com/option.html#legend.data.icon

    图例自定义显示

     

    legend:{
    formatter:function(name){
    var total = 0;
    var target;
    for (var i = 0, l = arr.length; i < l; i++) {
    total += arr[i].value;
    if (arr[i].name == name) {
    target = arr[i].value;
    }
    }
    return name + ' | ' +((target/total)*100).toFixed(2) + '%'+" "+target+" 条";
    },
    }

    arr 为name,value 数组
    formatter 为图例函数扩展
    ---------------------
    作者:lzty_天涯
    来源:CSDN
    原文:https://blog.csdn.net/qq_33129625/article/details/81328002
    版权声明:本文为博主原创文章,转载请附上博文链接!

  • 相关阅读:
    OpenFlow 消息
    Revolving Digits
    Tavas and Malekas
    Prefixes and Suffixes
    快速构造后缀自动机
    REBXOR
    BZOJ3689 异或之
    BZOJ3689 异或之
    最长路径异或和
    BZOJ 1355 [Baltic2009] Bazinga
  • 原文地址:https://www.cnblogs.com/telwanggs/p/10844562.html
Copyright © 2011-2022 走看看