Show percentage in jqplot piechart tooltip

I'm using primefaces with jqplot library.

In my piechart i have the extender property and in the javascript function i have this:

this.cfg.highlighter = {
     show:true,
     tooltipLocation: 'n',
     tooltipAxes: 'y',
     useAxesFormatters: false,
     tooltipFormatString: '%s'
}

The tooltip shows section value, but not section percentage.

Anybody knows how to show percentage value in tooltip?

Thanks.

You can bind the highlight event in order to modify the tooltip :

$("#chart1").bind('jqplotDataHighlight', function(ev, seriesIndex, pointIndex, data) {
 var highlightToolTip = $(".jqplot-highlighter-tooltip");   
 var pct = Math.round(data[1]/total*100);
 highlightToolTip.html(data[0]+", "+pct+"%");  
});

Where :

• data1 is the value of the highlighted slice,
• data[0] is the label of the highlighted slice,

• total is a variable containing the total value of your plot built here :

   data = [
      ['Heavy Industry', 12],['Retail', 9], ['Light Industry', 14], 
      ['Out of home', 16],['Commuting', 7], ['Orientation', 9]
  ];
  
  var total = 0;
  $(data).map(function(){total += this[1];})
  

Please see a working example on fiddle here