1.echarts柱状图Y轴最小刻度设置为1
场景:在统计工作量的图表中,患者数不可能出现小数
我们可以通过minInterval设置Y轴最小刻度单位
yAxis: [
{
type: 'value',
minInterval: 1,
}
],
2.解决X轴数据过多时,显示不全的问题
如图:
当统计一个月时,会出现日期显示不完整的问题,我们可以使用axisLabel设置坐标轴刻度标签,将interval属性设置为0,这个属性是标签显示间隔,若设置为1则间隔一个显示,另外因为字体太密集会覆盖,可以设置标签旋转一定角度,rotate设置为45
xAxis: [
{
type: 'category',
axisLabel: {
interval: 0,
rotate: 45
},
data: []
}
],
效果如下:
柱状图完整代码:
// 工作量柱状图
optionWorkload: {
color: ['#73c0de', '#ee6666', ],
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
legend: {},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: [
{
type: 'category',
axisLabel: {
interval: 0,
rotate: 45
},
data: []
}
],
yAxis: [
{
type: 'value',
minInterval: 1,
}
],
series: [
{
name: '实际治疗患者数',
type: 'bar',
stack: 'Ad',
emphasis: {
focus: 'series'
},
data: []
},
{
name: '爽约患者数',
type: 'bar',
stack: 'Ad',
emphasis: {
focus: 'series'
},
data: []
}
]
},