Amcharts Tooltip自定义：如何在tooltipText中调用当日判断函数

安全阿岳

2026-7-18

给AmCharts日期维度图表的当日tooltip添加“Today”字样的实现方法

实现思路

不用在tooltipText的字符串里直接拼接函数调用，而是通过函数式tooltipText或者tooltip内容适配器来实现，既能直接获取dateX、valueY这类内置数据，又能灵活调用自定义日期判断函数。

步骤1：编写日期判断函数

先写一个用来判断当前数据项日期是否为当日的函数，接收日期对象作为参数，返回对应的后缀文本：

function checkForCurrentDate(date) {
  const today = new Date();
  // 统一去除时分秒，只比较年月日
  const targetDate = new Date(date);
  return (today.getFullYear() === targetDate.getFullYear() &&
          today.getMonth() === targetDate.getMonth() &&
          today.getDate() === targetDate.getDate()) ? " Today" : "";
}

步骤2：配置tooltipText（函数式写法）

把tooltipText设为一个函数，直接接收当前数据项，就能拿到dateX和valueY，再调用判断函数拼接内容：

series.tooltipText = function(dataItem) {
  // 格式化日期（根据你的需求调整格式）
  const formattedDate = dataItem.dateX.formatDate("yyyy-MM-dd");
  return `${formattedDate}: [b]${dataItem.valueY}[/]${checkForCurrentDate(dataItem.dateX)}`;
};

可选方案：用tooltip适配器修改内容

如果想保留原有的tooltipText字符串配置，可以通过适配器动态追加内容：

// 先保留原tooltipText配置
series.tooltipText = "{dateX}: [b]{valueY}[/]";

// 添加适配器修改tooltip文本
series.tooltip.adapter.add("text", function(text, target) {
  const dataItem = target.dataItem;
  const todaySuffix = checkForCurrentDate(dataItem.dateX);
  return text + todaySuffix;
});