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'
                }
              }
            }
          }
        }
      ]
    };

  • 相关阅读:
    Cocos2d-x 3.2编译生成Android程序出错Error running command, return code: 2的解决方法
    利用Theme自定义Activity进入退出动画
    Activity的四种launchMode
    android中设置控件获得焦点
    android 反编译 for mac
    android中libs目录下armeabi和armeabi-v7a的区别
    解决Sublime Text 3中文显示乱码(tab中文方块)问题,sublime tab乱码
    mysql教程
    Failed to load c++ bson extension, using pure JS version
    mongodb导出数据
  • 原文地址:https://www.cnblogs.com/floraCnblogs/p/echart_total.html
Copyright © 2011-2022 走看看