How to show tooltip on a Google Pie Chart on legend hover?

Question

I want to show the tooltip of the slices on the mouse hover in the legend. By default it shows the tooltip only when the mouse is over a slice of the pie.

Currently the nearest thing I have is to show the tooltip when I click on the legend, with:

tooltip: { trigger: 'selection' }

as option when I draw the chart.

I tried to find something into the reference with no result.

JSFiddle: http://jsfiddle.net/ohavpo17/2/

Answer 1

You are close. Keep tooltip: { trigger: 'selection' } and add an event listener to onmouseover :

google.visualization.events.addListener(chart, 'onmouseover', function(entry) {
   chart.setSelection([{row: entry.row}]);
});

This will show the tooltip when the mouse hover the legend. As the docs says about onmouseover:

Fired when the user mouses over a visual entity. Passes back the row and column indices of the corresponding data table element. A slice or legend entry correlates to a row in the data table (column index is null).

So the above code simply simulates a selection for the row corresponding to the legend being hovered. I would also add an onmouseout listener, so a tooltip not hangs when the mouse leaves the chart :

google.visualization.events.addListener(chart, 'onmouseout', function(entry) {
   chart.setSelection([]);
});   

see demo -> http://jsfiddle.net/a095qq8e/