Getting the params data point value for the tooltip callback function in echarts?-CodePudding

I'm trying to get the value for this Apache EChart within the callback of the tooltip formatter.

If I hardcode the value then this formatting function works:

formatter: (params:any) => `$ ${Math.round(parseInt('100.000', 10))}`,

The tooltip displays $ 100.

However if I replace 100.000 with params.value, the value is NaN. How do we access the value?

CodePudding user response：

In the tooltip configuration of the Apache ECharts chart, you can use the params argument passed to the formatter function to access the data for the current tooltip. The params argument is an array of objects, where each object contains information about a series in the chart.

For example, if you are using a bar chart with a single series, the params array will have one element, which will contain information about the series data for the current tooltip. You can access the value for this series using the value property of the object in the params array.

formatter: (params: any) => {
  // Check if the params array has at least one element
  if (params.length > 0) {
    // Get the value for the first series in the params array
    const value = params[0].value;

    // Use the value to format the tooltip
    return `$ ${Math.round(parseInt(value, 10))}`;
  }

  // Return an empty string if the params array is empty
  return '';
}

We check if the params array has at least one element, and then access the value property of the first element in the array to get the value for the current tooltip. We use this value to format the tooltip text and return it from the formatter function.

Note that this code assumes that you are using a bar chart with a single series. If you are using a different type of chart, or a chart with multiple series, you may need to modify this code to handle the different data structure of the params array.