echarts 设置数据颜色渐变 + 自定义label 不同样式

设置颜色渐变

给 data 中数据 单独 设置 颜色渐变  data:[{name: "山",value:'60',itemStyle:{}}]
  itemStyle: {
     normal: {
        borderRadius: 4,
        borderWidth: 2,
        shadowBlur: 0, 
        //  linear 线性渐变，前四个参数分别是 x0, y0, x2, y2, 范围从 0 - 1，相当于在图形包围盒中的百分比，如果 globalCoord 为 `true`，则该四个值是绝对的像素位置
       //   radial  径向渐变，前三个参数分别是圆心 x, y 和半径，取值同线性渐变 color: {
          type: 'linear',
          x: 0,
          y: 0,
          x2: 0,
          y2: 1,
          colorStops: [
            {
              offset: 0,
              // color: '#08E171', // 0% 处的颜色 
            },
            {
              offset: 1,
              // color: '#82E4B7', // 100% 处的颜色
             // color: colorLis2[i],
            },
          ],
          global: false, // 缺省为 false
        },
      },

label 设置不同内容

    label: {
       show: true,
       position: 'outside',
       //   formatter:'icon|} {b|{b}} \n {c| {d}}'
       formatter:function (data) {    //自定义,加个判断 渲染不同样式 配🍱
           if(data.name=="视频广告"){
             return '{icon|}{b|' + data.name + '}' + '\n' + '{c|' + data.value +'}'
           }else{
            return '{dask|} {b2|' + data.name + '}'+' \n' +' {c|' +data.value +'%'+'}'
           }
       },
       rich:{
           b:{
               color:'red',
               fontSize:12
           },
           c:{
               color:'#000'
           },
            b2:{
               color:'green',
               fontSize:12
           },
           icon:{
               backgroundColor:{
                   image:'https://fuss10.elemecdn.com/3/28/bbf893f792f03a54408b3b7a7ebf0jpeg.jpeg',
               },
               height:20
           },
            dask:{
               backgroundColor:{
                   image:'https://cube.elemecdn.com/6/94/4d3ea53c084bad6931a56d5158a48jpeg.jpeg',
               },
               height:20
           }
       }
      }, 
      //  线条
      labelLine: {
        show: true
      },