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

时间: 2024-10-09 03:15:34

Echart显示在顶端显示总数的相关文章

asp 之 让实体中字段类型为DateTime的字段只显示日期不显示时间

       在我们平时的工作开发中,我们通常会遇到这样的一个问题:某个实体的某个字段是DateTime类型的,可是我们在界面上只想让它显示日期不显示时间! 一个订单实体: //订单类 public class order { //订单ID public int id{get;set;} //物品ID public int resId{get;set;} //物品名称 public string resName { get; set; } //物品价格 public decimal price

MAC 终端 显示隐藏文件 关闭显示隐藏文件

1.显示隐藏文件夹显示:defaults write com.apple.finder AppleShowAllFiles -bool true (1)复制“defaults write com.apple.finder AppleShowAllFiles -bool true” 到终端,回车 (2)按Command+Option+Escape打开强制退出,重启Finder (3)打开Finder,这时隐藏文件就都显示出来了,要注意隐藏文件一般不要删除 2.隐藏已经显示的隐藏文件 隐藏:defa

TOAD和PLSQL 默认日期显示、rowid显示、TNSNAME的修改

先说下要解决的问题: select rowid,acct_id,state_date from acct; 修改后,1)sql指明rowid,可以显示出来 2)时间格式显示为YYYYMMDD HH24:MI:SS 3)对于数字超长的,不使用科学计数法显示 安装与环境 (TOAD与PLSQL共存) TOAD 64BIT.PLSQL DEVELOPER 32BIT .各自的ORACLEINSTANT CLIENT TOAD通过安装包选择oracle instanct client路径安装:plsql

Android PopupWindow显示位置和显示大小

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:bac

asp 之 让实体中字段类型为DateTime的字段仅仅显示日期不显示时间

       在我们平时的工作开发中.我们一般会遇到这种一个问题:某个实体的某个字段是DateTime类型的,但是我们在界面上仅仅想让它显示日期不显示时间! 一个订单实体: //订单类 public class order { //订单ID public int id{get;set;} //物品ID public int resId{get;set;} //物品名称 public string resName { get; set; } //物品价格 public decimal price

css 只好显示两行 超过显示点点点

css 只能显示两行 超过显示点点点 css 可以做到:.p1{text-align: center;color:#C8CFD6;height:34px;text-overflow: -o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}

android:singleLine=&quot;true&quot;,[...]没有全部显示,只显示一个点[.]

现象描述: android:singleLine="true"时,text超出部分显示[.],没有显示省略号[...]. 如果想要一行显示文本,超出部分用省略号代替.一般会使用android:singleLine="true".这种解决办法大部分情况是对的,但是某些情况下会出问题.比如,以下情况: Button设置android:singleLine="true",text是英文的情况下,text超出部分显示[.],不显示省略号[...]. 上述

网络运营商名称显示&amp;SIM名称显示

一 网络名称显示这部分比较复杂,Spec对这也有明确的规定,根据其优先级由高往低介绍(其优先级参考TS 22.101), 1.       Enhanced Operator Name String,也就是Eons.此种方式的名称是存放在EF_PNN(PLMN Network Name, fid: 6FC5)和EF_OPL(Operator PLMN List, fid: 6FC6)中. EF_OPL中存放的是LAC和EF_PNN中的Record Identifier, EF_PNN中存放的是N

ffmpeg加文字水印并控制水印显示时间或显示周期

#以下脚本保存成.sh文件运行,不会出现中文乱码问题 网上查到用enable关键字控制,实际是draw #加水印 水印位置由x,y,w,h来控制 #ffmpeg编译时需--enable-libfreetype才能用此功能 #!/bin/bash ffmpeg -y -i jiushu.mpg -acodec libfaac -b:a 30k -ar 44100 -r 15 -ac 2 -s 480x272 -vcodec libx264 -refs 2 -x264opts keyint=150: