2012-04-03 15 views
7

tôi có mã javascript như:Làm thế nào để hiển thị các giá trị trên các vùng của bảng xếp hạng jqplot thay vì tỷ lệ

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]); 

Bây giờ bằng cách sử dụng dataLabels: 'value' Tôi có thể hiển thị giá trị nhưng thể hiện giá trị là 51 thay vì 50.667.Value được làm tròn.Nhưng tôi cần hiển thị giá trị chính xác. Làm thế nào để điều này ??

Câu hỏi thứ hai của tôi là khi tôi có con trỏ chuột trên bất kỳ vùng nào của biểu đồ, tôi muốn hiển thị điều gì đó.Điều đó sẽ được thực hiện bằng cách sử dụng jqplotDataMouseOver Nhưng cách sử dụng nó ?? Cảm ơn trước.Plz trả lời ngay lập tức khi khẩn cấp.

+0

Vui lòng cho tôi một số ý tưởng. – ryan

Trả lời

10

câu hỏi đầu tiên của bạn có thể được giải quyết với các dataLabelFormatString tài sản:

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' 
     } 
    }, 

Các '%.4f' sẽ hiển thị 4 chữ số thập phân.

Câu hỏi thứ hai của bạn khó hơn. Apparently events on bar charts không phải là khá ironed ra với jqplot. Tuy nhiên, đề nghị cuối cùng trong liên kết mà làm việc cho tôi:

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

Dưới đây là một jsfiddle, hãy nhớ cache file JS từ jqplot không cho phép hotlinking.