代码如下:
this.options = {tooltip: {trigger: "axis",textStyle: {align: "left",},className: "custom-tooltip-box",formatter: function (params) {return `<div class='custom-tooltip-style'><div class='title'><span>${params[0].name}年</span></div><div class="span"><div class="content"><span>合同金额:</span><span>${params[0].value}万元</span></div></div></div>`;},},color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{offset: 0,color: "rgba(4,180,53,0)", // 0% 处的颜色},{offset: 1,color: "#3CD783", // 100% 处的颜色},]),grid: {top: "26%",bottom: "0%",right: "8%",left: "8%",containLabel: true,},xAxis: [{type: "category",data: this.xAxisData,axisLabel: {show: true,margin: 14,fontSize: 12,textStyle: {color: "#ffffffcc"}},axisLine: {show: true,lineStyle: {color: "#355d8d",},},axisTick: {show: false,},},],yAxis: [{type: "value",name: '单位:万元',nameTextStyle: {fontSize: this.handleWidth(12),color: "#FFFFFF99",padding: [0, 18, 10, 0]},axisLine: {onZero: false,lineStyle: {color: "#87C2FF",width: 1, //这里是为了突出显示加上的},},axisLabel: {formatter: function (val) {return val + "";},show: true,margin: 8,fontSize: 12,textStyle: {color: "#FFFFFF99", //字体颜色},},splitLine: {show: true,lineStyle: {color: "#87C2FF66",width: 0.7,type: "dashed",},},},],series: [{type: "bar",// name: this.legendData[0],barWidth: 20,itemStyle: {borderWidth: 2,borderColor: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{offset: 0,color: "#3FFF8C", // 0% 处的颜色},{offset: 1,color: "#FBFFFA", // 100% 处的颜色},])},areaStyle: {normal: {//颜色渐变函数 前四个参数分别表示四个位置依次为左、下、右、上color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{offset: 0,color: "#3CD783", // 0% 处的颜色},{offset: 1,color: "rgba(4,180,53,0)", // 100% 处的颜色},])}},data: this.echartData}]
};