柱状图:
默认为纵向柱状图,如果要设置横向显示,则把yAxis的type改为'category'。
柱状图重叠会将一组数据全部重叠,如果要分组重叠,只能使用叠加的方式,叠加的值为两组数据的差值,这样可以实现多组数据重叠显示的效果。
1 function existCardDayPicInit(){ 2 let myChart = echarts.init(document.getElementById('existCardDayPic')); 3 let option = { 4 tooltip: {}, 5 xAxis: { 6 type: 'category', 7 data: ['1号岗', '4号岗', '7号岗', '9号岗', '10号岗', '12号岗', '14号岗', '15号岗'], 8 axisLabel: { 9 show: true, 10 interval:0, 11 textStyle: { 12 color: '#fff' 13 } 14 } 15 }, 16 yAxis: { 17 axisLabel: { 18 show: true, 19 textStyle: { 20 color: '#fff' 21 } 22 } 23 }, 24 series: [{ 25 name: '出门证', 26 data: [120, 200, 150, 80, 70, 110, 130, 200], 27 color: '#6997F3', 28 barWidth : 10, 29 type: 'bar' 30 } 31 ] 32 }; 33 34 var data = {}; 35 $.ajax({ 36 type: "POST", 37 url: "${ctx}/dataBoard/findCardGetExitNum", 38 data: data, 39 error: function (data) { 40 alert("出错了!" ); 41 }, 42 success: function (data) { 43 option.series[0].data = data.number; 44 myChart.setOption(option); 45 } 46 }); 47 }
折线图就将上述代码中的type改为'line'