amCharts V4垂直图表tooltip不跟随光标最近数据项更新问题

问题原因 #

你遇到的是amCharts V4垂直布局（Y轴为分类轴、X轴为值轴）下，光标交互默认适配水平布局的逻辑问题，按以下步骤配置即可解决：

方案1：官方标准配置（优先使用） #

按顺序修改你的图表配置，补充以下参数：

1. 配置光标交互规则

// 声明光标实例
chart.cursor = new am4charts.XYCursor();
// 指定交互绑定到Y轴（适配垂直方向移动触发）
chart.cursor.yAxis = yAxis; // 替换为你实际的Y轴实例变量名
// 关闭X轴吸附，仅按Y轴坐标匹配最近数据项
chart.cursor.xAxis = undefined;
// 绑定要吸附的系列，多系列可传入数组如[series1, series2]
chart.cursor.snapToSeries = series1;

2. 配置系列tooltip规则

// 垂直布局下用categoryY指代Y轴分类、valueX指代X轴数值，不要和水平布局的categoryX/valueY写反
series1.tooltipText = "{categoryY}: {valueX}";
// 调整tooltip指向方向，可根据需求替换为left/up/down
series1.tooltip.pointerOrientation = "right";
// 强制按数据项中点匹配光标位置
series1.dataItemTooltipLocation = 0.5;

方案2：手动控制tooltip（兜底方案，适配所有自定义场景） #

如果标准配置仍不生效，直接监听光标位置事件手动触发对应数据项的tooltip，逻辑完全可控：

chart.cursor.events.on("cursorPositionchanged", function(ev) {
  // 获取光标在Y轴的相对位置
  const yPos = ev.target.yPosition;
  // 匹配Y轴上距离最近的分类项
  const nearestAxisItem = yAxis.getNearestDataItem(yPos);
  if (!nearestAxisItem) return;
  // 查找目标系列中对应分类的数据项
  const targetSeriesItem = series1.dataItems.find(
    item => item.categoryY === nearestAxisItem.category
  );
  if (targetSeriesItem) {
    // 手动展示对应tooltip
    series1.tooltip.showAtDataItem(targetSeriesItem);
  }
});

内容的提问来源于stack exchange，提问作者ForNeVeR