Formatter AxisLabel ECharts，格式化label值

Question

我使用了 ECharts 的條形圖，現在我想將其 Y 軸值格式化為其他值。

現在 EChart 像上面那樣生成了我的圖表，但是我想顯示它的 Y 軸值而不是 30,000 或 60,000 我想將它顯示為 30K、60K、80K.. 和 150K。

我試過 Formatter 但它沒有調用 function 運行時，而 EChart 生成圖表來轉換值，看起來這樣我們可以只為值添加前綴/后綴

yAxis: [
    {
      type: 'value',
      data: [],
      axisLine: {
        show: true,
        lineStyle: {
          show: true,
          color: "black",
         },
       },
       axisLabel: {
         formatter: '{value} K'
       }
    },

我還嘗試在格式化程序中提供 function，但我沒有找到將當前值作為參數傳遞給 function 的方法。

yAxis: [
    {
      type: 'value',
      data: [],
      axisLine: {
        show: true,
        lineStyle: {
          show: true,
          color: "black",
         },
       },
       axisLabel: {
         formatter: getFormattedValue(VALUE)
       }
    },

更新：使用新的嘗試，但仍然無法正常工作

當我們在 EChart 官方網站上像下面這樣使用它時，它就可以工作了 https://echarts.apache.org/handbook/en/basics/release-note/5-3-0/#formatting-of-values-in-tooltip

      axisLabel: {
        formatter: val => `${val / 1000}K`
      }

更新了格式正確的圖表

但是當我像下面那樣使用它時它就不起作用了，即使 function 也沒有被調用，值保持原樣

      axisLabel: {
        formatter: val => `${val / 1000}K`
      }

圖表未更新

Answer 1

實際上，您非常接近解決方案...

 let option = { xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri'] }, yAxis: { type: 'value', axisLabel: { formatter: val => `${val / 1000}K` } }, series: [ { data: [30000, 60000, 90000, 120000, 150000], type: 'line' } ] }; let myChart = echarts.init(document.getElementById('main')); myChart.setOption(option);

 #main { width: 100%; height: 350px; }

 <script src="https://cdn.jsdelivr.net/npm/echarts@5.4.1/dist/echarts.min.js"></script> <div id="main"></div>

格式化程序記錄在此處： Documentation - Apache ECharts