最终效果如下
1 option = { 2 title: { 3 text: '投稿排行', 4 left: 'center', //标题居中 5 }, 6 dataset: { 7 source: [ 8 ['amount', 'product'], 9 [58212, '一中队'], 10 [78254, '二中队'], 11 [41032, '三中队'], 12 [12755, '四中队'], 13 [20145, '五中队'], 14 [79146, '六中队'], 15 [91852, '七中队'], 16 [101852, '八中队'], 17 [20112, '九中队'] 18 ] 19 }, 20 tooltip: { 21 22 formatter: function (params) { 23 return params.value[1]+ ':' + params.value[0] +'篇' ; //取数组value组合显示效果 24 }, 25 }, 26 grid: {containLabel: true}, 27 xAxis: {name: '数量'}, 28 yAxis: { 29 name:'中队名称', 30 type: 'category', 31 axisLabel: { 32 interval: 0, 33 rotate: 30 //y轴名称旋转30度 34 }, 35 36 }, 37 38 series: [ 39 { 40 type: 'bar', 41 encode: { 42 x: 'amount', 43 y: 'product' 44 }, 45 itemStyle: { //颜色渐变 46 color: new echarts.graphic.LinearGradient( 47 0, 0, 1, 0, 48 [ 49 {offset: 0, color: '#83bff6'}, 50 {offset: 0.5, color: '#188df0'}, 51 {offset: 1, color: '#188df0'} 52 ] 53 ) 54 }, 55 label: { 56 normal: { 57 position: 'right', 58 show: true 59 } 60 }, 61 } 62 ] 63 };
请将上面代码复制到 https://www.echartsjs.com/examples/zh/editor.html?c=dataset-encode0&theme=light 运行查看效果