Tooltip delay when updating a state.

[RafaelCENG]

As you can see in the video the first part is when im updating the state. What im trying to do is having different backgroundColor in my tooltip based on my index. (doesn't work even with the state)
In the first part you can see that my tooltip is delayed. In the second part i comment out the setter and is perfectly fine.
Any tips about this?

tooltip: {
       trigger: "axis",
       formatter: function (params) {
         // setCurrentIndex(params[0].dataIndex);
         return params[0].dataIndex === 0
           ? `${rangeLow.format("DD")}-${rangeLow.add(firstWeek.length-1, "day").format("DD MMM")} \n ${params[0].value.toFixed(1)}%` //prettier-ignore
           : params[0].dataIndex === 52
           ? `${rangeHigh.subtract(lastWeek.length-1, "day").format("DD")}-${rangeHigh.format("DD MMM")} \n ${params[0].value.toFixed(1)}%` //prettier-ignore
           : `${newRangeLow.add(params[0].dataIndex-1, "week").format("DD")}-${newRangeLow.add(params[0].dataIndex-1,"week").add(6,'day').format("DD MMM")} \n ${params[0].value.toFixed(1)}%` //prettier-ignore
       },
       // backgroundColor: currentIndex > 39 ? "#FF5630" : "#A19D9A",

Screen.Recording.2023-08-25.at.10.57.37.AM.mov

[RafaelCENG]

Any news about this one?

[zhiqingchen]

This feature is currently not supported in echarts.

[zhiqingchen]

If you use useState it will cause re-rendering, which will be delayed.

[RafaelCENG]

Is there an other way to make it happen or is not possible currently?

[zhiqingchen]

It is possible to make a feature request to the echarts project to have the backgroundColor support callback functions, but this is not a common feature

[zhiqingchen]

It is also possible to implement it yourself by patching the echarts package