I have javascript code as:

var plot1 = jQuery.jqplot ('chartdiv', [data], 
{ 
  seriesDefaults: {
        // Make this a pie chart.
        renderer: jQuery.jqplot.PieRenderer, 
        rendererOptions: {
          // Put data labels on the pie slices.
          // By default, labels show the percentage of the slice.
          showDataLabels: true,
          dataLabels: 'value'
        }
  }, 
  legend: { show:true, location:'e'}
});


var handler = function(ev, gridpos, datapos, neighbor, plot) { 
    if (neighbor) { 
        alert('x:' + neighbor.data[0] + ' y:' + neighbor.data[1]); 
    }
}; 

$.jqplot.eventListenerHooks.push(['jqplotClick', handler]); 

Now by using dataLabels: 'value' I am able to show values but shown value is 51 instead of 50.667.Value is rounded.But I need to show exact value.How to this??

My second question is that When I have mouse pointer on any region of the chart I want to show something.Is that would be done using jqplotDataMouseOver But how to use it?

I have javascript code as:

var plot1 = jQuery.jqplot ('chartdiv', [data], 
{ 
  seriesDefaults: {
        // Make this a pie chart.
        renderer: jQuery.jqplot.PieRenderer, 
        rendererOptions: {
          // Put data labels on the pie slices.
          // By default, labels show the percentage of the slice.
          showDataLabels: true,
          dataLabels: 'value'
        }
  }, 
  legend: { show:true, location:'e'}
});


var handler = function(ev, gridpos, datapos, neighbor, plot) { 
    if (neighbor) { 
        alert('x:' + neighbor.data[0] + ' y:' + neighbor.data[1]); 
    }
}; 

$.jqplot.eventListenerHooks.push(['jqplotClick', handler]); 

Now by using dataLabels: 'value' I am able to show values but shown value is 51 instead of 50.667.Value is rounded.But I need to show exact value.How to this??

My second question is that When I have mouse pointer on any region of the chart I want to show something.Is that would be done using jqplotDataMouseOver But how to use it?

• javascript
• jquery
• charts
• onclick
• jqplot

Share Follow edited Feb 23, 2020 at 11:29 Cœur 38.8k2626 gold badges205205 silver badges277277 bronze badges asked Apr 3, 2012 at 12:05 ryanryan 33322 gold badges1515 silver badges2828 bronze badges 0

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 11

Your first question can be solved with the dataLabelFormatString property:

seriesDefaults: {
        // Make this a pie chart.
        renderer: jQuery.jqplot.PieRenderer, 
        rendererOptions: {
          // Put data labels on the pie slices.
          // By default, labels show the percentage of the slice.
          showDataLabels: true,
          dataLabels: 'value',
          dataLabelFormatString:'%.4f'
        }
  }, 

The '%.4f' would show 4 decimal places.

Your second question is more difficult. Apparently events on bar charts are not quite ironed out with jqplot. But the last suggestion in that link works for me:

$('#chartdiv').bind('jqplotDataMouseOver', function (ev, seriesIndex, pointIndex, data) { alert('series: '+seriesIndex+', point: '+pointIndex+', data: '+data)}); 

Here's a jsfiddle, remember to cache the JS files since jqplot does not allow hotlinking.