zoukankan      html  css  js  c++  java
  • Echart显示在顶端显示总数


    option = {
      tooltip : {
        trigger: 'axis',
        axisPointer : { // 坐标轴指示器,坐标轴触发有效
          type : 'shadow' // 默认为直线,可选为:'line' | 'shadow'
        }
      },
      legend: {
        data:['条形1','条形2','条形3'],
        selectedMode:false
      },
      toolbox: {
        show : true,
        orient: 'vertical',
        x: 'right',
        y: 'center',
        feature : {
          mark : {show: true},
          dataView : {show: true, readOnly: false},
          magicType : {show: true, type: ['line', 'bar', 'stack', 'tiled']},
          restore : {show: true},
          saveAsImage : {show: true}
        }
      },
      calculable : true,
      xAxis : [
        {
          type : 'category',
          data : ['一','二','三','四','五',]
        }
      ],
      yAxis : [
        {
          type : 'value'
        }
      ],
      series : [
        {
          name:'条形1',
          type:'bar',
          stack: '条形',
          data:[220, 232, 201, 234, 190],
               itemStyle:{
              normal:
              {
                barBorderRadius: 0,
              }
            }
          },
          {
            name:'条形2',
            type:'bar',
            stack: '条形',
            data:[220, 182, 191, 234, 290],
            itemStyle:{
              normal:
              {
                barBorderRadius: 0,
              }
            }
          },
          {
            name:'条形3',
            type:'bar',
            stack: '条形',
            data:[150, 232, 201, 154, 190],
            itemStyle:{
              normal:
              {
                barBorderRadius: [5, 5, 0, 0],
                label:{
                show:true,
                position:'top',
                formatter: function(params) {
                  //计算汇总值
                  var name = params.name;
                  var index; //x轴序列顺序
                  for (var i = 0; i < option.xAxis[0].data.length; i++) {
                    if (name == option.xAxis[0].data[i]) {
                      index = i;
                      break;
                    }
                  }
                  var total = 0;
                  for (var i = 0; i < option.series.length; i++) {
                    if (option.series[i].stack == params.series.stack) {
                      total += option.series[i].data[index];
                    }
                  }
                  return total;
                },
                textStyle: {
                  color: 'red'
                }
              }
            }
          }
        }
      ]
    };

  • 相关阅读:
    模板方法模式
    Centos 6.4 python 2.6 升级到 2.7
    Python 在Visual studio 中做单元测试进行TDD开发
    C# 代码转换到Python
    VMware Network Adapter VMnet1和VMnet8 未识别的网络的解决方法
    Visual Studio 启动加速
    查询Sqlserver 表结构信息 SQL
    HTTP发送请求模拟
    【Xamarin 开发 IOS --使用 Storyboard Segue 实作 UIViewController 的切换 (实例)】
    【Xamarin 开发 IOS --IOS 页面导航概念Segue】
  • 原文地址:https://www.cnblogs.com/floraCnblogs/p/echart_total.html
Copyright © 2011-2022 走看看