image.png

效果大概就是上边这个样子

主要代码

series: [
        // 这个是正常显示柱状图
            {  
              type: "bar",
              barWidth: 24,
              data: this.data,
              
              label:{
                show:false,
                position:"top",
                color: '#00edfa'
              },
              itemStyle: {
                // lenged文本
                opacity: 1, // 这个是 透明度
                color: function(params) {
                  // 渐变
                  return new echarts.graphic.LinearGradient(
                    0,
                    1,
                    0,
                    0,
                    [
                      {
                        offset: 0,
                        color: '#0072e5' // 0% 处的颜色
                      },
                      {
                        offset: 1,
                        color: '#00edfa' // 100% 处的颜色
                      }
                    ],
                    false
                  )
                }
              },
            },
            {
            // 这个是柱状图顶部的方块
              name: '',
              type: 'pictorialBar',
              symbol: 'diamond',
              symbolSize: [24, 18],
              symbolOffset: [0, -9],
              z: 3,
              itemStyle: {
                normal: {
                  // color: params => params.data.endColor,
                  color: function(params) {
                  return new echarts.graphic.LinearGradient(
                    0,
                    1,
                    0,
                    0,
                    [
                      {
                        offset: 0,
                        color: '#0072e5' // 0% 处的颜色
                      },
                      {
                        offset: 1,
                        color: '#00edfa' // 100% 处的颜色
                      }
                    ],
                    false
                  )
                },
                  label: {
                    show: true, // 开启显示
                    position: 'top', // 在上方显示
                    textStyle: {
                      fontSize: '12',
                      color: '#00edfa',
                    }
                  }
                }
              },
              symbolPosition: 'end',
              data: this.data
            },

          ],