Javascript HighCharts Math Operationen in ToolTip

Ich versuche, ein Diagramm auf der Grundlage von Werten, die ich von DB ohne Probleme bis jetzt zu zeichnen.Javascript HighCharts Math Operationen in ToolTip

Nun, was ich versuche zu tun, eine andere Information über den Tooltip angezeigt werden, die eine konstante unitprice und multipliziert diese Konstante mit point.y

tooltip: { 
       shared: true, 
       useHTML: true, 
       headerFormat: '<small>{point.key}</small><table>', 
       pointFormat: '<tr><td style="color: {series.color}">{series.name}: </td>' + 
        '<td style="text-align: right"><b>{point.y} kWh</b></td><td style="text-align: right"><b>'+ (this.y * unitPrice) + '</b></td></tr>', // {series.unit} 
       footerFormat: '</table>', 

      },

Multiplikation ist NaN genannt verwendet, wie Sie unten sehen können .

Hier ist, was ich meinte:

Es soll 11829,68 mit 0,41 multiplizieren (die unitprice Wert ist) anstelle bekomme ich NaN

Was mache ich falsch?

Quelle

2017-07-11 FreshPro

Was ist der Wert von 'this.y' ist? Auch "11.829.68" ist keine gültige Nummer, also ... Sie bekommen den Punkt. Zum Beispiel sollte '0,41'' 0,41' sein und '11,829,68' sollte' 11,82968' sein. Wenn Sie dann versuchen, sie zu multiplizieren, erhalten Sie ein korrektes Ergebnis. – Ionut

Es sollte Y-Achse sein. In diesem spezifischen Punkt 11,829.68, wie im Bild – FreshPro

@Ionut gesehen, ist es 11829.68 I Format-Nummer, um so anzuzeigen – FreshPro

Für den Zugriff auf this mit aktuellen Point object sollten Sie pointFormatter Callback-Funktion verwenden (Sie können nicht auf this in pointFormat zugreifen).

Siehe Beispiel unten:

Highcharts.chart('container', { 
 

 
    xAxis: { 
 
     categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] 
 
    }, 
 

 
    tooltip: { 
 
     pointFormatter: function() { 
 
      return this.series.name + ' : <b>' + this.y 
 
       + ' (some math here : ' + this.y * 2.5 + ')</b><br/>'; 
 
     }, 
 
     shared: true 
 
    }, 
 

 
    series: [{ 
 
     name: 'dogs', 
 
     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] 
 
    }, { 
 
     name: 'cats', 
 
     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].reverse() 
 
    }] 
 

 
});

<script src="https://code.highcharts.com/highcharts.js"></script> 
 
<div id="container" style="height: 300px"></div>

Quelle

2017-07-11 11:57:16

Ah, ich sehe meinen Fehler jetzt. Um "this.y" verwenden zu können, muss pointFormatter verwendet werden – FreshPro

Javascript HighCharts Math Operationen in ToolTip

Antwort

Verwandte Themen