Stacked bar graph move the mouse into the tooltip to prompt that the filter is 0 element, so as to realize custom bubbles

The specific implementation effect diagram is as follows ：


It looks fresher .

The implementation code is as follows ：

tooltip: {
    
     trigger: 'axis',
     axisPointer: {
      //  Axis indicator , Axis trigger is valid 
         type: 'shadow' //  The default is line , Optional ：'line' | 'shadow'
      },
      formatter: function (params) {
    
        var res = `${
      params[0].name} <br/>`
        for (let item of params) {
    
           if(item.value != 0){
    
              res +=`<span style="background: ${
      item.color}; height:10px; width: 10px; border-radius: 50%;display: inline-block;margin-right:10px;"></span> ${
      item.seriesName} ：${
      item.value}h<br/>`
           }
        }
        return res
     }
},

Why is a label with inline styles added here ？
The reason is that the colored dots in front of each item are missing , Need to use html+css Draw a