I'm drawing a line across multiple data points using d3.svg.line. I don't want to show anything to represent the individual data points -- just the bare line -- but I'd like to be able to mouse over the inflection points where the line segments meet to see tooltip information about each data point.
I've added a <g> element positioned at each datapoint and the <title> element works fine for tooltips as long as I have something visible, like <circle> as the parent of <title>. But if I use <title> directly under <g>, it doesn't show anything. If I set the fill/stroke of <circle> to "none", the tooltip no longer appears.
Is there a simple way to get tooltips to appear over specific points without any visible elements being present?
Draw a transparent rect and put the tooltip on that perhaps? fill="transparent"