如何使用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 { ... }部分。