How to get the hovered element on Line Chart using Recharts

问题

I am actually new here. And new in ReactJS too :(

What I'm trying to do is when I hover over the value 1 line, only the value 1 data will be shown inside the tooltip. So as you can see that's not the case with this tooltip.

Please help I really need it.

回答1:

Try this code on each Line element

activeDot={{onMouseOver:this.customMouseOver}}

Create a method to handle it

customMouseOver(e){
  return (
   <div className="customMouseOver">
     //e hold the line data in payload element
   </div>
  );
}

来源：https://stackoverflow.com/questions/49142917/how-to-get-the-hovered-element-on-line-chart-using-recharts