e-charts堆叠柱状图自定义tooltip

最新推荐文章于 2024-08-19 18:09:40 发布

太阳的后裔

最新推荐文章于 2024-08-19 18:09:40 发布

阅读量487

点赞数

分类专栏： js

本文链接：https://blog.csdn.net/weixin_43942765/article/details/118756495

版权

js 专栏收录该内容

60 篇文章 3 订阅

订阅专栏

该博客探讨了Echarts图表库中tooltip的复杂配置，特别是如何根据数据动态展示信息。内容涉及触发方式、阴影效果以及多轴数据的格式化显示，强调了在数据为空时的处理策略，适用于提升数据可视化的交互体验。

摘要由CSDN通过智能技术生成

tooltip: {
    trigger: 'axis',
    axisPointer: {            
        type: 'shadow'        
    },
    formatter: function (param) {
        if (param.length === 2) {
            if (param[0].data.value != "" || param[1].data.value != "") {
                return param[0].name + '<br/>' + param[0].marker + param[0].seriesName + ": " + param[0].data.value + "</br>" +
                    param[1].marker + param[1].seriesName + ": " + param[1].data.value
            } else {
                return '';
            }
        } else {
            if (param[0].seriesName === "合格") {
                if (param[0].data.value != "") {
                    return param[0].name + '<br/>' + param[0].marker + param[0].seriesName + ": " + param[0].data.value
                } else {
                    return '';
                }
            } else {
                if (param[0].data.value != "") {
                    return param[0].name + '<br/>' + param[0].marker + param[0].seriesName + ": " + param[0].data.value
                } else {
                    return '';
                }
            }
        }

    }
}