[JavaScript知识库]柱状图每条柱子有多个颜色

这种echarts柱状图称为堆叠柱状图，每条柱子上的颜色都不一样，并且代表不一样的内容。主要是给series中的对象 通过配置项stack来设置的，并且stack的值要完全相同

let option = {
            color:['#3dc5d1', '#ee4e40', '#fbb321'],
            tooltip: {
              trigger: "axis",  
              axisPointer:{
                type:'none'  //去掉鼠标悬浮时中间那条线
              }
            },
            xAxis:{
              type:'category',
              data: this.xAxisData,
              axisLabel:{
                color:'#988368',
                fontSize:30,
              },
              axisTick:{
                show:false
              },
              axisLine:{
                lineStyle:{
                  color:"#9c8c7c",
                  width:2
                }
              }
            },
            yAxis:{
              type:'value',
              splitNumber:5,
              splitLine:{
                show:true,
                lineStyle:{
                  color:"#615b4b"
                }
              },
              axisLabel:{
                color:'#988368',
                fontSize:30,
              },
              axisTick:{
                show:false
              },
              axisLine:{
                lineStyle:{
                  color:"#9c8c7c",
                  width:2
                }
              }
            },
            label:{
              color:'#988368',
              fontSize:30
            },
            barWidth:45, //柱子宽度
            series:[
              {
                name:'碳排放培训',
                type:'bar',
                stack:'堆叠',
                data:this.yAxisData1,
              },
              {
                name:'节能培训',
                type:'bar',
                stack:'堆叠',
                data:this.yAxisData2,
              },
              {
                name:'环保培训',
                type:'bar',
                stack:'堆叠',
                data:this.yAxisData3,
              },
            ]
      }