Remove hover tooltip from Google Visualization pie chart (core chart)

20
votes

How to remove hover tooltip from Google Visualization pie chart (core chart)? Need to make it work cross-browser, eg, IE, FF, Chrome, Safari, Opera

enter image description here

Edit: I need the slices to be be clickable too.
enableInteractivity : false removes the hovers but doens't throw 'select' or other interaction-based events.

4
javascripthtmlgoogle-visualization
From this: code.google.com/p/google-visualization-api-issues/issues/… it doesn't seem that you can do it. Unless you can hack onmouseover somehow... - AR.
code.google.com/apis/chart/interactive/docs/release_notes.html - "Tooltip - In the current version, tooltips open automatically on mouse hover; you cannot open or close them using the API." I checked source code for SVG and it doesn't seem that there's any class that that assigned to tooltips so hiding using css or js will not work. - AR.

4 Answers

50
votes

Maybe you need to add this to your chart's options

'tooltip' : {
  trigger: 'none'
}

In this way you can leave enableInteractivity set to true.

16
votes

Use the enableInteractivity = False option. It will disable interaction and hover.

chart.draw(data, {   
  width: 400, 
  height: 240, 
  title: 'Your chart and data',
  enableInteractivity: false,
  hAxis: {title: 'Year'}
});
2
votes

set tooltip: { isHtml: true } in option section.

chart.draw(data, {   
  tooltip: { isHtml: true },
  width: 400, 
  height: 240, 
  title: 'Title',
  hAxis: {title: 'Year'}
});

in css file

div.google-visualization-tooltip { display:none }
2
votes

This remove hover event but maintains the click event:

tooltip: { trigger: 'selection' }