2012-12-19 11 views
15

Mam tabelę highcharts z dwiema seriami danych, które używają nazwanych wartości. W moich podpowiedziach dla jednej serii chcę odwołać się do punktu danych z serii. Więc rozwiązanie w tej odpowiedzi: How to use a different formatter on Highcharts in each curve of the same graphic? nie pomaga mi. Potrzebuję więcej niż tylko tooltipText, potrzebuję formatowania:Czy mogę używać dwóch różnych formaterów dla podpowiedzi high-chart?

dla jednego:

formatter: function() { 
    return this.x + ': ' + this.series.name + 
    '<br> $' + Highcharts.numberFormat(this.y, 0); 
    } 

I drugi:

formatter: function() { 
    return 'In ' + this.x + ' the median value was' + this.median + 
    'and the total $' + Highcharts.numberFormat(this.y, 0);       
} 

Odpowiedz

28

Wewnątrz formater this reffers do skupionego serie, można dodać if/else wewnątrz formatyzatora i zwróć ciąg znaków dla każdego, jak poniżej.

tooltip: { 
    shared: false, 
    formatter: function() { 
     var text = ''; 
     if(this.series.name == 'MSFT') { 
      text = this.x + ': ' + this.series.name + 
        '<br> $' + Highcharts.numberFormat(this.y, 0); 
     } else { 
      text = 'In ' + this.x + ' the median value was' + this.median + 
        'and the total $' + Highcharts.numberFormat(this.y, 0); 
     } 
     return text; 
    } 
} 

demo

+7

+1, dzięki - choć moim zdaniem , lepiej użyć 'this.series.options.id' zamiast' this.series.name', aby nie polegało na czymś, co może łatwo ulec zmianie. Identyfikator można ustawić podczas inicjowania serii. –

-1

Oto przykład. Skrzypce przykładem jest here:

tooltip: { 
      formatter: function() { 
       var s = '<b>' + Highcharts.dateFormat('%A, %b %e, %Y', this.x) + '</b>'; 

       $.each(this.points, function() { 
        s += '<br/>1 USD = ' + this.y + ' EUR'; 
       }); 

       return s; 
      } 
     }, 
3

Można łatwo zdefiniować formatowania toolip dla każdej serii - patrz tutaj: http://api.highcharts.com/highcharts/plotOptions.series.tooltip

{ 
    tooltip: { 
      shared: true 
    }, 
    series: { 
    name: 'some series name', 
    data: mydata, 
    tooltip: { 
     valueSuffix: ' bar' 
    } 
    } 
} 

Przykład: http://jsfiddle.net/28qzg5gq/

+0

To nie jest formater, to tylko przyrostki. Dodanie formatyzatora w obiekcie konfiguracyjnym tylko jednej serii musi zostać wykonane za pomocą funkcji 'pointFormatter' - [example] (http://jsfiddle.net/28qzg5gq/12/). –

Powiązane problemy