对数轴不能从0开始,可以从1开始,所以首先要解决的问题是将对数轴的起始值显示为0(实际值仍为1),在yAxis中配置axisLabel
axisLabel: {
formatter: function (value) {
return value === 1 ? 0 : value
},
},
这时候值为1的柱状图仍然不会展示,为了让这个柱状图能展示出来,我们需要手动去修改它的值,这里我改了1.55
let data = array.map((val) => {
let v = val ? val.num: 0; //处理值为null或者undefind
return v == 1 ? 1.55 : v; //将值为1的转换为1.55
})
此时柱状图就能看见了,但是还有问题就是数据展示的不正确,毕竟我们手动把1都改掉了换成了1.55,这样的话我们只要把label和tooltip的展示数据格式化一下就好了,下面给个tooltip的写法,label的原理相同
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow",
},
confine: true,
formatter: function (params) {
let returnData = params[0].name + "<br/>";
for (let i = 0; i < params.length; i++) {
let indexColor = params[i].color;
returnData += '<span style="display:inline-block;margin-right:5px;border- radius:10px;width:9px;height:9px;background:' + indexColor + '"></span>';
if (params[i].seriesType == "bar" && params[i].value == 1.55) { //这里判断了一下,只有柱状图类型值为1.55才转换,如果为折线图则不变,label也是一样的
returnData += params[i].seriesName + ":1" + "</br>";
} else {
returnData += params[i].seriesName + ":" + (params[i].value ? params[i].value : 0) + "</br>";
}
}
return returnData;
},
}
label: {
show: true,
formatter: function (param) {
if (param.type == "bar" && param.data == 1.55) {
return 1
} else {
return param.data
}
}
},