时间戳

首页 > 解决方案 > ApexCharts：热图工具提示格式化程序

javascript - ApexCharts：热图工具提示格式化程序

问题描述

我正在使用 apexcharts 显示热图图表：

Apex 热图图表

该系列以 Date 对象命名，这些对象在 y 轴上的格式如下：

yaxis: {
    labels: {
        formatter: function(value){
            if(value instanceof Date){
                return value.toLocaleDateString(undefined, {year: 'numeric', month: 'long'});
            } else {
                return value;
            }
        }
    }
},

如何为工具提示获得相同的格式？它们改为显示日期对象的常规字符串表示，但我只想显示月份和年份（如在 y 轴上）：

ApexChart 热图工具提示

标签： javascriptformattingformatdate-formattingapexcharts

解决方案

将一个值传递给 options 数组，并为其中的 y 轴tooltip的值设置一个格式化程序：title

tooltip: {
    y: {
        title: {
            formatter: function(value){
                if(value instanceof Date){
                    return value.toLocaleDateString(undefined, {year: 'numeric', month: 'long'});
                } else {
                    try {
                        return new Date(value).toLocaleDateString(undefined, {year: 'numeric', month: 'long'});
                    } catch (e) {
                        return value;
                    }
                }
            }
        }
    }
}

确保检查传递给格式化程序的值的类型，并在必要时创建一个新的Date对象。

推荐阅读