Highcharts geteilter Tooltip erfordert unterschiedliche WerteSuffix und variierende Dezimalstellen

Question

Ich habe einen Highchart Graph, der Temperatur, Wind, Druck und Niederschlag grafisch darstellt.

kann es hier http://www.dmjsystems.co.uk/weather/forecast.php gesehen

ich mit der zusätzlichen Komplikation einen gemeinsamen Tooltip bin mit, dass der Max Regen ist insgesamt die min und der max in der gestapelten Säule für regen. Momentan ignoriert der Code mein seriesbasiertes Suffix und ich konnte keine einzelnen Dezimalstellen zum Arbeiten bringen (d. H. Alle zeigen 3 Dezimalstellen).

Jedes der Elemente hat ein anderes Suffix (Temp = (Gradzeichen) C, Wind = mph, Pressure = mb und Rain = in) und unterschiedliche Nachkommastellen (Wind = keine, Temp = 1, Pressure = 1 und Regen = 3).

ich zur Zeit eine allgemeine Tooltip codiert bin mit wie folgt:

tooltip: { shared : true, 
      formatter: function() { 
      return '<span style="color:#039;font-weight:bold">' + Highcharts.dateFormat('%A' + ', ' + '%b %d' + ', ' + '%H' + ':' + '00',this.x) + '</span><br/>' + 
         this.points.map(function(point, idx) { 
          return '<span style="color:' + point.series.color + '">' + point.series.name + 
            '</span>: <span style="color:#669;font-weight:bold">' + 
            Highcharts.numberFormat((idx == 0) ? point.total : point.y,3) + 
            '</span>'; 
         }).join('<br/>'); 
      } 
    }, 

aber ich glaube, ich brauche diese zu bewegen (außer geteilt: true) Serie basiert Tooltips, die point (insbesondere tooltip.ySuffix verwenden, die Ich denke, lassen Sie mich das Suffix richtig angeben) und valueDecimals, um den Dezimalpunkt für jede Serie festzulegen, aber ich kann keine Beispiele für Code finden, um diese Funktionen zu verwenden.

Sobald ich mich vom allgemeinen Tooltip entfernt habe, kann ich die Summierung nicht mehr für die gestapelte Spalte verwenden.

Wenn mir jemand in die richtige Richtung zeigen könnte, würde ich es schätzen.

Answer 1

Sie können jeder Serie einfach eine Tooltip-Option hinzufügen.
Sie können die Optionen auf der folgenden link sehen.
Auf diese Weise müssen Sie die einzelnen Punkte der Serie nicht formatieren.

series: [{ 
    name: 'USD', 
    data: yourData, 
    tooltip: { 
     ySuffix: ' USD', 
     yDecimals: 4 
    } 
}, { 
    name: 'EUR', 
    data: yourData, 
    tooltip: { 
     yPrefix: 'EUR ', 
     yDecimals: 1 
    } 
}] 

Demo

Referenz:

• Highcharts tooltip

Answer 2

es möglich ist, eine gemeinsame Tooltip zu verwenden und Präfixe eingestellt, Suffixe etc. Sie müssen nur darüber nachdenken, die Formulierung. Anstatt yprefix verwenden usw. verwenden Sie valuePrefix

Sie es in den Daten für jede Serie eingestellt

series: [{ 
     data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4], 
     type: 'column' 

    }, { 
     data: [216.4, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5], 
     tooltip: { 
    valuePrefix: ' USD' 
}}], 

Sie ein fiddle hier sehen kann zeigt es

Answer 3

Sie einen benutzerdefinierten Formatierer für den Tooltip angeben des Diagramms und dann ein Wert-Suffix und andere Optionen in der Serien-Tooltip, und verweisen Sie dann auf diese Optionen in der Tooltip-Formatiererfunktion des Diagramms. Z.B .:

$('XXXX').highcharts({ 
 
\t ... 
 
\t tooltip: { 
 
       formatter: function() { 
 
        var text = ""; 
 
        $.each(this.points, function(index) { 
 
         text += '<br/><b>' + this.series.name + ":</b> "+ this.y+" "+this.series.tooltipOptions.valueSuffix; 
 
        }); 
 
        return text; 
 
       }, 
 
       shared: true 
 
      }, 
 
\t ... 
 
}); 
 

 
... 
 

 
chart.addSeries({ 
 
      ... 
 
      tooltip: { 
 
       valueSuffix: ' '+seriesUnit, 
 
       valueDecimals:2 
 
      }, 
 
      ... 
 
     });