D3: mouseover text changes within an area in sunburst

Question

I have a sunburst code here: http://plnkr.co/edit/EG0MzWEPB242g7VdSQQd?p=preview

When I click the orange area that corresponds to "from tumor cell" (see the caption below in the diagram), I get focussed diagram centered on "from tumor cells".

When I mouseover the area in the region marked "Liver or Pancreas", the texts in the caption box below changes while it should not. I suppose this problem is only in the second and third quadrant (90 degree to 270 degree). I couldn't find a way to solve this problem after spending so much time.

I hope some one has an answer to it.

Answer 1

The problem is that you're attaching the mouse over handlers to the g element, which isn't updated when you click on a segment. The easy way to fix this is to attach the handlers to the path elements, which do get updated, instead. In that case you probably also want to set the text elements to receive no pointer events so that there are no spurious mouse events when moving over them.

Complete demo here.