TypeScript环境下如何获取amCharts堆叠柱状图X轴实际展示值

你之前使用tooltipText适配器拿到的是amCharts未渲染的模板字符串，自然无法获取实际展示的格式化数值，根据你需要的取值场景可以选择对应方案：

场景1：获取单个数据点对应格式化后的X轴数值 #

直接调用X轴内置的格式化方法处理原始数值，得到的结果和轴上展示的格式化值完全一致：

// 可在tooltip适配器、数据点点击事件等回调逻辑中使用
this.series.adapter.add('tooltipText', (template, target) => {
  // 取当前数据点的原始X值
  const rawXValue = target.dataItem.get('valueX');
  // 调用X轴的格式化器，复用你配置的numberFormat/dateFormat规则
  const formattedXValue = this.xAxis.getFormatter('value').format(rawXValue);
  // formattedXValue就是你要的34,590,000,000这类格式化后的值
  console.log(formattedXValue);
  return template;
});

如果你的X轴是日期类型，把getFormatter('value')替换为getFormatter('date')即可。

场景2：获取X轴所有已渲染刻度的格式化数值 #

直接遍历X轴的刻度对象，取渲染完成的label文本即可：

// 要等图表渲染完成后取值，建议放在chart的ready事件回调中
this.chart.events.on('ready', () => {
  const formattedXValues: string[] = [];
  this.xAxis.ticks.each((tick) => {
    if (tick.label) {
      formattedXValues.push(tick.label.text());
    }
  })
  console.log('X轴所有展示值：', formattedXValues);
});

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