ECharts图表设置x轴和y轴显示数值
未设置的效果：
想要达到的效果：
重要代码：
xAxis.axisLabel.interval = 5; // 设置x轴间隔5个显示// 设置y轴显示的最大值和最小值yAxis.min = 0,yAxis.max: function (value) {return value.max + 50;},yAxis.splitNumber: 3,
完整代码：
option = {color: ['#5983FE'], // 关键加上这句话，legend的颜色和折线的自定义颜色就一致了legend: {icon: 'circle',itemHeight: 6, // 改变圆圈大小itemWidth: 10,//图标宽itemHeight: 6,//图标高orient: 'horizontal',left: '7%',textStyle: {fontSize: 12,color: '#666'}},grid: {top: 30,left: '3%',right: '3%',bottom: '3%',containLabel: true, // 是否显示刻度标签},tooltip: {trigger: 'axis',position: this.toolTipPos,formatter: function (param) {var usage = param[0].value === "" ? "-- " : Math.abs(param[0].value);var html = '<span style="margin-right:5px;display:inline-block;width:10px;height:10px;border-radius:5px;background-color:' + param[0].color + ';"></span>';html += param[0].axisValue + " " + param[0].seriesName + '：' + usage + 'kWh';return html;}},xAxis: {type: 'category',boundaryGap: false, // 不留白，从原点开始axisLine: {// 坐标轴 轴线show: true, // 是否显示symbol: ['none', 'arrow'], // 是否显示轴线箭头symbolSize: [6, 6], // 箭头大小symbolOffset: [0, 7], // 箭头位置lineStyle: {color: '#ccc',width: 1,type: 'solid'}},axisTick: {// 坐标轴刻度show: true, // 是否显示inside: true, // 是否朝内length: 3,// 长度lineStyle: {// 默认取轴线的样式color: '#ccc',width: 1,type: 'solid'}},axisLabel: {// 坐标轴标签show: true, // 是否显示inside: false, // 是否朝内rotate: 0, // 旋转角度margin: 5, // 刻度标签与轴线之间的距离color: '#999', // 默认取轴线的颜色 interval: 5},data: ['8:00', '9:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00', '19:00', '20:00', '21:00']},yAxis: {min: 0,max: function (value) {return value.max + 50;},splitNumber: 3,axisLine: {// 坐标轴 轴线show: true, // 是否显示symbol: ['none', 'arrow'], // 是否显示轴线箭头symbolSize: [6, 6], // 箭头大小symbolOffset: [0, 7], // 箭头位置lineStyle: {color: '#ccc',width: 1,type: 'solid'}},axisTick: {// 坐标轴的刻度show: true, // 是否显示inside: true, // 是否朝内length: 3,// 长度lineStyle: {color: '#ccc', // 默认取轴线的颜色width: 1,type: 'solid'}},axisLabel: {// 坐标轴的标签show: true, // 是否显示color: '#999', // 默认轴线的颜色},splitLine: {// gird 区域中的分割线show: true, // 是否显示lineStyle: {color: '#E5E5E5',width: 0.7,type: 'dashed' // dashed}},},series: [{name: '用电量',data: [820, '', 301, 434, 290, 330, 320, 111, 345, 345, 234, 678, 456, 678],type: 'line',symbol: 'true', // 设置小圆点消失smooth: 0,itemStyle: {normal: {lineStyle: {color: '#5983FE'}}},}],}
