I am voting for this issue. A news graphic had to be canned today because the raw data
and the percentages were forced into the tooltip. Had to go back to static graphic.

Original issue reported on code.google.com by peggy.bustamante on 2011-02-05 00:47:09

You can now change the tooltip text of other chart types using Data Roles but you cannot
do this with Pie Charts for some reason?

Original issue reported on code.google.com by rywall on 2012-01-09 18:45:57

There's a tooltip.text option (http://code.google.com/apis/chart/interactive/docs/gallery/piechart.html#Configuration_Options)
that allows some flexibility in the tooltip content. Would that work for you?

Original issue reported on code.google.com by jinji.viz on 2012-01-10 08:16:50

tooltip.text is not sufficient because percentage format cannot be customized.

Original issue reported on code.google.com by fehmican.saglam on 2012-10-24 11:05:53

are html tooltips still not supported on pie charts?

I am displaying some additional information on tooltips of other chart types and would
need to unify the style over all charts.

Original issue reported on code.google.com by saarlo@statsit.com on 2013-10-02 04:43:22

I can confirm that PieChart don't seem to support the custom tooltips as described on
https://developers.google.com/chart/interactive/docs/customizing_tooltip_content

I added the relevant tooltip code to my DataTable, and it did not affect the tooltip
for my PieChart. When I changed the chart type to something else (I used ColumnChart),
the custom tooltips worked.

Original issue reported on code.google.com by mich.garbacz on 2013-10-07 19:51:09

For those who need to manipulate the text shown in the tooltip, here is a hack that
worked for us. We used jQuery, but you can really use any DOM manipulation API you
like.

// Listen for modifications to the svg document
$('svg').bind('DOMSubtreeModified', function () {
  // desired tooltip elem identified by presence of "%)" text
  var elems = $('svg').find('text:contains("%)")');
  if (elems.length == 0) return;
  var elem = $(elems.first());
  elem.text("<DESIRED TEXT HERE>");
});

If you need to manipulate the the SVG document even further, you might consider using
jQuery SVG: http://keith-wood.name/svg.html

Note: this approach can overflow the call stack since you might modify the DOM in the
function that responds to DOM modifications.

Original issue reported on code.google.com by cliffcrosland on 2013-12-12 17:14:13

Caution: 'DOMSubtreeModified' used in comment #8 is not cross-browser compatible. If
you need more cross-browser compatibility, perhaps see the following stackoverflow
discussion to find an appropriate way to monitor dom changes for your use case:

http://stackoverflow.com/questions/2457043/most-efficient-method-of-detecting-monitoring-dom-changes

Original issue reported on code.google.com by cliffcrosland on 2013-12-12 17:29:48

Using the "google.load('visualization','1.0', { packages:['corechart']})" line of code,
I can verify that using "{'type':'string','role':'tooltip'} work in barchart but not
in piechart.  I can also verify that using "'tooltip.trigger':'none'" does not work
either.  I don't know what Google employees did with the programming that broke stuffs
in PIE Chart.

Original issue reported on code.google.com by fletchsod.developer on 2014-01-27 15:44:13

I can confirm too that customizing tooltip text on piechart doesn't work right now.
I pass a role: toolip to DataTable and the text is still the default one, when in a
BarChart it works.

Original issue reported on code.google.com by gamacri2000 on 2014-02-26 15:49:07

Still doesn't seem to work. Successfully configured custom tooltip for ColumnChart but
not for PieChart :S.

Original issue reported on code.google.com by serhiy.boychenko on 2014-03-17 16:56:47

There is no other way to add Custom tooltip or change the style of Piechart tooltip?

Original issue reported on code.google.com by anantrams2005 on 2014-05-19 13:49:21

Confirming everyone, it simply does not work and IS A BUG. Just lost 4 hours of my time,
hence my frustration. There is no reason for having an exception for the pie chart
alone. It works for other charts. Worse, the tooltip bubble does not adapt to its contents
and the labels it displays overflow the bubble (very ugly and unusable). I simply wanted
to display another custom column in the tooltip (some extra info). Can't do it. Stuck
with ugly % or the value that is already on the slice anyway. Totally useless.  A tootlip
should not be a repeat of what is already visible. This is a conceptual error and a
lack of consistency with the other charts. Should never happen. Please fix it so I
can start using it again.

Browser used: Google Chrome Version 36.0.1985.125 m.

Thank you.

Original issue reported on code.google.com by nospheratu000 on 2014-08-02 18:17:48

Please fix. This is huge problem for my use-case!

Original issue reported on code.google.com by mike@mobilefit.com on 2014-08-06 20:30:40

I am also facing this issue, I need a custom tooltip on pie chart and I am not able
to get it... :(

Original issue reported on code.google.com by prg.bhayani on 2014-10-08 13:29:34

Same problem here... :(

Original issue reported on code.google.com by clapadat@advansys.it on 2014-10-23 15:32:37

i'm voting for too....

Original issue reported on code.google.com by vaillentin on 2014-10-29 15:46:09

Yeah, i'm voting too, plz fix it (thx in advance)

Original issue reported on code.google.com by SarracenoGamer on 2014-11-27 11:22:46

Hi, try this link https://gist.github.com/alexrainman/bb8d49357250df0859c0 
It worked for me :)

Original issue reported on code.google.com by sharika@magnusvista.com on 2014-12-02 07:00:13

why can't google devs say that explicitly in the documentation to avoid confusion? Customizing
HTML tooltip works only for bar chart and etc. Not for Pie chart. I lost 4 hours of
my life. 

Original issue reported on code.google.com by macmac.uy on 2015-03-03 07:47:24

They really should. I wasted quite a while on the same.

On Tue, Mar 3, 2015 at 2:47 AM, <
google-visualization-api-issues@googlecode.com> wrote:

Original issue reported on code.google.com by mike@mobilefit.com on 2015-03-03 14:16:42

The documentation has been fixed: https://developers.google.com/chart/interactive/docs/customizing_tooltip_content

Supporting customizable tooltips for PieChart would be a good idea.  I'm not sure we'll
get to it before we replace it entirely with a new implementation.

Original issue reported on code.google.com by dlaliberte@google.com on 2015-03-18 12:17:43

I don't see how the documentation is fixed? It still shows that HTML tooltips should be supported by Pie Charts, when in reality they are not.

Custom tooltips are now supported in pie charts, as are HTML tooltips.

@grabks the documentation still needs updating. I did not know I need to load the "1.1" version of the visualization API for them to work.

Also, it seems that the tooltip column must be the 3rd column, or it won't work. It will fail to load/use the tooltip from any other column

So, it seems that there are at least 2 requirements for HTML tooltip in Pie Charts, not mentioned anywhere in the docs:

1. Load version 1.1 of the API
2. Make sure the tooltip column is the 3rd column

@ragulka We generally don't update the documentation with which version to use, since 1.1 will eventually be pushed to 1.0, and a new release will be pushed to 1.1, and so on. You can read more about our release process here.

As for the other question, given that the Pie Chart only supports two data columns and no other roles except 'tooltip', I'm not sure where the confusion here is coming from, since the documentation explicitly states that the third column and onward should be a role column. Perhaps we should make the charts throw an error when you give it extra columns?

@grabks the confusion comes from the docs saying "column N (optional)". Since N can generally represent any number, and the Purpose is stated as "Optional roles", I did not see how this could explicitly state that the 3rd column should be the tooltip column.

The way I understand it, is that any column starting from 3rd is optional, and the role is also optional.

I don't think that throwing error when given an extra (non-role) column is good, as the optional columns are a great way to store metadata (IDs, slugs, etc) about each row.

I see how this can be confusing now. The way I was seeing it is that the first two columns can be followed by any number of supported role columns (since the purpose is "Optional roles", but I suppose that doesn't make it clear that the roles for those columns are non-optional), where the only supported role is 'tooltip'. This would mean that you can follow it with any number of tooltip columns (although only one would really make sense).

The pie chart throwing an error for extra columns wouldn't prevent you from using extra columns to store metadata, since you could always create a DataView that's just right for the pie chart, and then refer back to the original table for the metadata. You would already have to do this for other charts that have stricter data formats.

I could also see us extending the pie chart to support multiple layers (like a sunburst), or multiple pie charts (like the gauge chart), where it would actually start to make use of the extra columns, so it's probably not a good idea to use extra columns for metadata for this reason.

In any case, I filed an internal bug for us to improve the documentation, so it should be fixed soon.

Here we are 3 1/2 years after the final post on this and still tooltips don't work on pie charts unless they are the third column and there's nothing in the docs about it. And, no 'tooltip' isn't the only valid role for pie charts, 'style' is a valid role too.

I just wasted half a day trying to get tooltips to work before I found this post, thanks Google developers and tech writers. Time to look at Charts.js

Not true, it does work now. I can confirm that this is working. You must have a column with:
{"type": "string", "role": "tooltip", "p": {"html": true}}
and you must include in your options:
tooltip: {isHtml: true}
and in the graph data you must reference a js function to build the tooltip, such as:
createCustomHTMLContent("'.$key.'", '.$val.', "'.$colcolor.'") // my vars were inserted via php
and finally you must include your js function:
function createCustomHTMLContent(key,val,colcolor) {
return '