1. 问题
主要是为了解决数据相差过大，导致柱状图高低差距太大的问题
2. 新问题
查询资料及文档发现出现这种数据量过大的情况可以设置yAxis.type = 'log'（使用对数轴）即可解决但是对数轴的要求是数据必须大于0，如果数据中含有0的话，柱状图显示会出现以下异常
3. 解决
对于这种有0的数据，可以在数据插入是将其设为其他值，并在显示时针对这个特殊值重新渲染为0
// tooltip显示优化
tooltip: {
trigger: 'axis',
formatter: function (params) {
let html = params[0].name
params.forEach((item, index) => {
html += `<br/>${item.marker + item.seriesName}: ${item.value === 0.1 ? 0 : item.value}`
})
return html
},
}
// yAxis显示优化
yAxis: [
{
type: 'log',
min: 1,
// 兼容特殊数据，防止log模式下数据显示出现问题
axisLabel: {
formatter: function (value) {
return value == 0.1 ? 0 : value
},
},
},
],
// label显示优化
series: [
{
name: '成功',
type: 'bar',
data: [],
label: {
show: true, //开启显示
position: 'top', //在上方显示
formatter: function ({value}) {
return value == 0.1 ? 0 : value
},
},
}
]
