• 调整圆环统计图格式


    圆环中间空白处添加标题

    对应圆环边上添加详细信息

    https://blog.csdn.net/GRAY_KEY/article/details/80559054

    如下图格式:

    第一处:调整统计图主题颜色:

    // 基于准备好的dom,初始化echarts实例
    //初始化并绑定html页面中的div显示统计图形,第二个参数为主题颜色
    mychart = echarts.init(document.getElementById('leaderchart'),"light");

    第二处:让对应的数字显示在对应圆环上:position:'inner'

    series: [
    {
    type:'pie',
    radius: ['40%', '80%'],
    center: ['70%', '50%'],
    avoidLabelOverlap: false,
    label: {
    normal: {
    show: true,
    position:'inner',
    formatter:'{c}',//'{a|{a}}{abg|} {hr|}  {b|{b}:}{c}  {per|{d}%}  ',,官方实例http://echarts.baidu.com/examples/editor.html?c=pie-nest

    color:'#000'设置字体颜色
    //backgroundColor:'#eee',添加背景颜色
    //borderColor:'#eee',添加边框颜色
    //borderWidth: 8添加边框宽度
    }
    },

    把标示线去掉
    labelLine: {
    normal: {
    show: false
    }
    },
    data:tong_data
    }
    ]

     第三处:种类添加分页type: 'scroll',

    legend: {
    type: 'scroll',
    orient: 'vertical',
    x:"left",
    left: 10,
    selectedMode:false,
    data:tong_reson
    },

    这个是固定统计图表的位置

    grid: {
    left: "5%",
    bottom: "5%",
    containLabel: true
    },

    第四处:空白处添加标题:

    // 标题
    title: [{
    text: '退菜(份)'+all_num+' 退菜原因占比',
    top:'42%',//对比圆环中心center调整位置
    left:'57%',
    textStyle:{
    color: '#000',
    fontSize:13,
    }
    }],

  • 相关阅读:
    JVM基础和调优(一)
    Jtree(节点的渲染+资源管理器)(2)
    Jtree (节点的渲染+资源管理器)
    jtree(选择框)
    java进阶计划
    SQL优化
    spring 事务管理
    Spring事务配置的五种方式(转)
    spring与数据库之间的配置
    struct2(六) 为表单添加验证
  • 原文地址:https://www.cnblogs.com/mangwusuozhi/p/9244176.html
Copyright © 2020-2023  润新知