Echarts柱状图 双柱

tech2026-04-14  7

tooltip: { trigger: 'axis', axisPointer: { // 坐标轴指示器,坐标轴触发有效 type: 'shadow' // 默认为直线,可选为:'line' | 'shadow' }, formatter(params) { let list = [] let listItem = ''; let name = ''; params.forEach((item, i) => { name = item.name; list.push('<span>' + item.seriesName + '转资额</span>: ' + item.value +' 万元<br/>' ); }); listItem = list.join(''); return '<div class="showBox">' + listItem +'</div>' } }, color: ['#64C7BF','#73A0FA'], legend: { y: 'top', data: ['测试1', '测试2'] }, grid: { left: '0', right: '0', bottom: '5', containLabel: true }, xAxis: [{ data: ['2020', '2021', '2022'], axisTick: { show: false //隐藏刻度线 }, axisLine:{ //隐藏y轴 show:false }, axisLabel:{ //横坐标全部显示 不隔开显示 interval: 0 } }], yAxis: [{ name: '转资额(万元)', nameTextStyle: { padding: [0, 0, 0, 30] // 四个数字分别为上右下左与原位置距离 }, splitArea: { //隐藏背景网格区域 show: false }, splitLine: { //隐藏背景网格线 show: false }, axisTick: { show: false //隐藏刻度线 }, axisLine:{ //隐藏y轴 show:false } }], series: [{ name: '测试1', type: 'bar', data: [{ name: "2020", value: 200 }, { name: "2021", value: 100 }, { name: "2022", value: 400 } ] }, { name: '测试2', type: 'bar', data: [{ name: "2020", value: 66 }, { name: "2021", value: 88 }, { name: "2022", value: 99 } ] } ]
最新回复(0)