如图,我用了ECharts的这个柱状图,下面x轴的数字太密集了,能不能让x轴的坐标间隔一个显示数字?
xAxis: {
axisTick: {
show: false
},
axisLine: {
show: false,
lineStyle: {
color: 'rgba(255,255,255,0.2)'
}
},
interval: 5,
type: 'value',
axisLabel: {
show: true,
interval: 'auto',
formatter: '{value}',
textStyle: {
color: 'rgba(255,255,255,0.7)'
}
},
splitLine: {
lineStyle: {
color: 'rgba(255,255,255,0.2)'
}
},
show: true,
data: ['0%', '', '10%', '', '20%', '', '30%', '', '40%', '', '50%', '', '60%', '', '70%', '', '80%', '', '90%', '', '100%']
},
你只需要在XAxis那边设置下里面的data数组就行了,举个例子:
xAxis: {
type: 'category',
min:'2.00',
max:'18.00',
boundaryGap: false,
name:'年龄',
axisLabel: {
formatter: '{value}'
},
data: ['2.00', '2.25', '2.50', '2.75', '3.00', '3.25', '3.50','3.75','4.00'
这是我一个项目中x轴从显示分别是2.00,2.25,2.50...... 如果我要间隔一个只需要在data之间插入空字符串就行了,改成
data: ['2.00', ' ' ,'2.25', ' ', '2.50', ' ' ,'2.75', ' ','3.00'...... ]