ECharts柱状图Y轴标签格式化问题：数值转K格式函数未生效

核心需求 #

将Y轴数值按1000=1K的规则格式化，比如30000显示为30K，60000显示为60K。

正确实现方式 #

直接给axisLabel.formatter传递一个函数（箭头函数或普通函数），让ECharts自动传入当前数值并执行格式化：

yAxis: [
  {
    type: 'value',
    axisLine: {
      show: true,
      lineStyle: {
        color: "black"
      }
    },
    axisLabel: {
      // 方式1：ES6箭头函数（需项目环境支持）
      formatter: val => `${val / 1000}K`
      // 方式2：普通函数（兼容所有环境）
      // formatter: function(val) {
      //   return (val / 1000) + 'K';
      // }
    }
  }
]

你之前的错误分析 #

1. 字符串格式器的局限：
   你写的formatter: '{value} K'只会在原始数值后追加“ K”，不会做除法运算，最终会显示30000 K，不符合需求。

2. 自定义函数的调用错误：
   你写的formatter: getFormattedValue(VALUE)是直接执行了函数，把返回值赋值给了formatter，而ECharts需要的是函数本身的引用，这样它才能在需要格式化时自动调用并传入当前数值。正确写法应该是：

   // 先定义格式化函数
   function getFormattedValue(val) {
     return (val / 1000) + 'K';
   }
   
   // 配置中传递函数引用
   yAxis: [
     {
       // ...其他配置
       axisLabel: {
         formatter: getFormattedValue
       }
     }
   ]
   

3. 箭头函数本地未生效的排查方向：

   • 检查项目是否配置了ES6转译工具（如Babel），如果运行环境不支持箭头函数，换成普通函数写法即可。
   • 确认ECharts版本（3.x及以上均支持函数格式器），若版本过低建议升级。
   • 排查是否有其他全局配置或组件覆盖了axisLabel的formatter设置。

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