2013-08-07 3 views
7

Je veux personnaliser l'info-bulle du dernier point d'une série spécifique, laisser d'autres points dans cette série, et d'autres séries, avec le format d'info-bulle par défaut. Fondamentalement, je cherche quelque chose de similaire à cette config. Merci d'avance pour votre aide!highcharts personnaliser l'info-bulle pour un seul point

series: [{ 
      tooltip: { // ?? tooltip does not work inside series 
       formatter: function() { 
        if (lastPoint in the series) { // ?? how to determine if lastPoint 
         return '<b>Final result is </b> ' + this.y; 
        } 
        // ?? return default format if it is not the last point in the series 
       } 
      },    
      data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6]   
     }, { 
      data: [194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2]   
     }] 

Répondre

13

La fonction de formatage ne semble pas fonctionner lorsqu'elle est définie pour une série. Vous pouvez vérifier dans quelle série vous vous trouvez en utilisant this.series.name et ensuite vous pouvez vérifier si vous êtes sur le point final en utilisant this.series.xData.length - 1 == this.point.x. Mais, il serait plus facile de nommer le point que vous voulez cibler et de le vérifier dans la fonction de formatage. http://jsfiddle.net/Swsbb/. Pour voir toutes les données de formatage, cochez ici http://api.highcharts.com/highcharts#tooltip.formatter.

$('#container').highcharts({ 
    xAxis: { 
     categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul'] 
    }, 
    tooltip : { 
     formatter: function() { 
      var tooltip; 
      if (this.key == 'last') { 
       tooltip = '<b>Final result is </b> ' + this.y; 
      } 
      else { 
       tooltip = '<span style="color:' + this.series.color + '">' + this.series.name + '</span>: <b>' + this.y + '</b><br/>'; 
      } 
      return tooltip; 
     } 
    }, 
    series: [{ 
       data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, {y:135.6, name: 'last'}] 

    }, 
    { 
     data: [194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2] 
    }] 

}); 
Questions connexes