ECharts多组堆叠柱状图顶部显示总和与自定义Tooltip实现

{
        name: lastAdStack.name,
        type: "bar",
        stack: "Ad",
        label: {
          normal: {
            show: true,// 显示label
            position: "top", // 显示的label的位置
          }
        },
        data: [],//数据
      }

{
        name: lastAdStack.name,
        type: "bar",
        stack: "Ad",
        label: {
          normal: {
            show: true,
            position: "top",
        // 首先把所有项的总和都算出来按照固定的顺序方法zonghe这个数组中  
          然后在方法中用下标对应上总和方法 return出来就可以改变他的label现实文字
            formatter: function (params) {
              var index = params.dataIndex;
              return zonghe[index]
            },      
          }


        },

        data: [],
      }

tooltip: {
          trigger: "axis",
          axisPointer: {
            type: "shadow",
          },
          formatter: (params) => {
            var res = params[0].name
            for (var i = 0; i < params.length; i++) {
              if (this.adStackArr[params[i].seriesIndex].name != null) {  
            // 这行代码就是判断语句 具体情况 具体分析  自己打印params 来实现自己的判断
                res += `<div >
                  <span style="display:inline-block;margin-right:5px;border-radius:50%;width:10px;height:10px;background-color:${[
                    params[i].color,
                  ]};"></span>
                  ${params[i].seriesName}
                  ${params[i].data}
                </div>`;
              }
            }
            return res; //最后返回的数据得一个字符串 并且支持html css 显示我用的都是行内式样式 拼接成一个字符串 给最后显示 数遍悬浮的样式也是在这里设置 你的字符串是什么样式  渲染出来就是什么样的
          }
        },