如何使用jQuery highcharts更改工具提示

Question

我試圖讓我的工具提示顯示我的y值，而不是他們當前所做的百分比。例如，當鼠標懸停在Yellow上時，工具提示將顯示22.6%。它應該改爲91.5黃色吃喝玩樂。

$(function() { 
    $('#container').highcharts({ 
     chart: { 
      plotBackgroundColor: null, 
      plotBorderWidth: null, 
      plotShadow: false 
     }, 
     title: { text: 'Skittles By Color' }, 
     subtitle: { text: '15.4 oz (437 g) Bag' }, 
     tooltip: { pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>' }, 
     plotOptions: { 
      pie: { 
       allowPointSelect: true, 
       cursor: 'pointer', 
       dataLabels: { 
        enabled: true, 
        format: '<b>{point.name}</b>: {point.percentage:.1f} %', 
        style: { color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black' }, 
        connectorColor: 'silver' 
       } 
      } 
     }, 
     series: [{ 
      type: 'pie', 
      name: 'Color %', 
      data: [ 
       { name: 'Green', y: 64, sliced: true, selected: true, color: '#00ff00'}, 
       { name: 'Purple', y: 71, color: '#660066' }, 
       { name: 'Red', y: 88.0, color: '#dd0000' }, 
       { name: 'Orange', y: 91, color: '#ff6600' }, 
       { name: 'Yellow', y: 91.5, color: '#ffff00' } 
      ] 
     }] 
    }); 
}); 

jsfiddle

Answer 1

你看到在你的代碼的tooltip部分？這就是你需要改變什麼：

pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>' 

...應該是...

pointFormat: '<b>{point.y} skittles</b>' 

如這裏證明：http://jsfiddle.net/jpotLvt7/11/。

如果您將來遇到類似問題，我建議您查看代碼，看看是否有與您的問題相關的名稱的任何部分。在這種情況下，並不難找到。您想更改工具提示文本，並且您的代碼中有一個tooltip { ... }部分。