[Solved]-Adding tooltips to line graph data points AFTER lines animate-d3.js

The easiest way to add a tooltip is to append an svg:title element to the elements you want to have a tooltip for. It will be displayed by the browser automatically when you hover over the element. It works for all kinds of elements as well.

So your code would need to look something like

var path = svg.append("path")   // Add the valueline path. 
      .attr("class", "line")
      .attr("d", valueline(data))
      .attr("stroke", "steelblue")
      .attr("stroke-width", "5")
      .attr("fill", "none")
      .append("title").text("whatever");

If you need more sophisticated functionality, you could try for example tipsy, which works in a similar way.