echarts Tooltip params are not passed properly when the value of one of the series is null, undefined or NaN

trafficstars

Version

5.2.1

Reproduction link

Steps to reproduce

Create a simple ECharts line graph with two value-based data series
Configure ECharts option so that the tooltip is triggered and define a custom tooltip formatter function called tooltipFormatter
Assign the first series data with data: [null], data: [undefined] or data: [NaN]
Assign the second series data with any valid number, e.g. data: [0]
Pass the options to ECharts engine.

function tooltipFormatter(params) {
  console.log(params[1]?.seriesName);
  console.log(params[0]?.seriesName);
}

const option = {
  tooltip: {
    trigger: "axis",
    formatter: tooltipFormatter
  },
  xAxis: {
    data: [1]
  },
  yAxis: {
    show: true
  },
  series: [
    {
      type: "line",
      name: "first",
      data: [null]
      // data: [NaN]
      // data: [undefined]
    },
    {
      type: "line",
      name: "second",
      data: [0],
    }
  ]
};

What is expected?

The tooltip formatter function tooltipFormatter should receive two series and their corresponding values: the first one with null (or undefined, NaN, respectively) and the second with 0.

What is actually happening?

The tooltip formatter function tooltipFormatter receives only one series which is the second, the first series is not passed in (perhaps due to its value is null, undefined, or NaN).

If the first series data is assigned with a valid number such as data: [1], the tooltip formatter receives correctly two series with their corresponding values.

The use case is that, I would want the two series and their values passed into the custom tooltip formatter function regardless so that I can render them according to my application requirements. As the first data series is not passed in if its value is null, undefined, or NaN), the tooltip formatter cannot handle it normally in generic case but has to use some dirty workarounds.

Sep 30 '21 23:09 htr3n

Hi! We've received your issue and please be patient to get responded. 🎉 The average response time is expected to be within one day for weekdays.

In the meanwhile, please make sure that it contains a minimum reproducible demo and necessary images to illustrate. Otherwise, our committers will ask you to do so.

A minimum reproducible demo should contain as little data and components as possible but can still illustrate your problem. This is the best way for us to reproduce it and solve the problem faster.

You may also check out the API and chart option to get the answer.

If you don't get helped for a long time (over a week) or have an urgent question to ask, you may also send an email to [email protected]. Please attach the issue link if it's a technical question.

If you are interested in the project, you may also subscribe to our mailing list.

Have a nice day! 🍵