ApexCharts.js 折线图 - 在工具提示中显示占总数的百分比

如何解决ApexCharts.js 折线图 - 在工具提示中显示占总数的百分比

我想显示百分比而不是整数。 现在，当鼠标悬停在图表的数据点（工具提示）上时，它只是将值显示为整数。

我想我需要像这样设置格式化程序：

let test = value / SUM(all_values)
return test.toFixed(0) + '%'

但是，我在他们的文档中找不到它，我找到的最好的是这个它总是给我 100%，每个数据点：

    tooltip: {
      y: {
        formatter: function(value,opts) {
                let percent = opts.w.globals.seriesPercent[opts.seriesIndex][opts.dataPointIndex];
                return percent.toFixed(0) + '%'

        }
      }
    }

解决方法

您是对的，您需要使用工具提示格式化程序，但是您用来获取百分比值的数组不正确。

如果您记录值 opts.w.globals.seriesPercent，您会发现都是 100：

[[100,100,...,100]]

（我怀疑这可能是因为它旨在与其他图表类型一起使用。）

你仍然可以获得百分比，只是需要计算出来。

使用相同的方法设置工具提示的格式，但从 opts.series 获取值：

    tooltip: {
        y: {
          formatter: function(value,opts) {
              const sum = opts.series[0].reduce((a,b) => a + b,0);
              const percent = (value / sum) * 100;
              return percent.toFixed(0) + '%'
          },},}