it-swarm.com.de

Formatieren von Highcharts-Dezimalstellen von dataLabels

Sehen Sie sich bitte this example an und lassen Sie mich wissen, wie ich die DataLabels so formatieren kann, dass sie nur mit zwei Dezimalzahlen angezeigt werden.

Hier sind die Zahlenformate, die ich in der Serie habe

 series: [{
                name: 'Tokyo',
                data: [7.554555, 6.34345559, 9.5555, 14.5555, 18.4333433, 21.5555, 25.2, 26.5333333, 23.33333, 18.23243543, 13.776565669, 9.65454656]
            }, {
                name: 'London',
                data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
            }]

und ich möchte sie gerne als 7.55, 6.34, 9.55 vorstellen. Vielen Dank

16
Suffii

Sie müssen das dataLabelsformatter und Highcharts.numberFormat kombinieren: /:

...
dataLabels: {
    enabled: true,
    formatter: function () {
        return Highcharts.numberFormat(this.y,2);
    }
}
...

Siehe jsFiddle

26
bozdoz

Ich würde einfach die Formatierungsoption zu Datenbeschriftungen wie folgt hinzufügen:

dataLabels: {
    enabled: true,
    format: '{point.y:,.2f}'
}

Dies ist der einfache Weg, dies zu tun, ohne eine Funktion mithilfe des Formatierers definieren zu müssen.

extra:

Das Komma nach dem Doppelpunkt stellt sicher, dass eine Zahl wie 1450.33333 als 1.450.33 angezeigt wird, was auch Nizza ist.

16
ZekeDroid

Falls jemand "weiter" gehen möchte, zeige ich Daten, die zwischen 10 ^ 1 und 10 ^ 9 liegen können, also konvertiere ich sie und zeige die Einheit danach.

Denken Sie daran, dass Highcarts sich nur mit Ganzzahlen befasst. Wenn Sie Einheiten hinzufügen möchten (und nicht in der YAxis wegen mehrerer Einheiten), können Sie diese in den Quelldaten angeben. 

column: {
            dataLabels: {
                enabled: true,
                formatter: function () {
                    // Display only values greater than 0.
                    // In other words, the 0 will never be displayed.
                    if (this.y > 0) {
                        if (this.y >= Math.pow(10, 9))
                        {
                            return Highcharts.numberFormat(this.y /Math.pow(10, 9) , 1) + " mias";
                        }
                        else if (this.y >= Math.pow(10, 6))
                        {
                            return Highcharts.numberFormat(this.y /Math.pow(10, 6) , 1) + " mios";
                        }
                        else
                        {
                            return Highcharts.numberFormat(this.y, 0);
                        }
                    }
                },

mias: steht für "milliards" (französische Übersetzung von Billard) mios: steht für "millionen" (französische Übersetzung von Millionen)

2
pti_jul

Ich habe in den Kommentaren bemerkt, dass Sie keine nachgestellten Nullen anzeigen wollten. 

Dies war die einfachste Lösung, die ich aufbringen konnte:

...
dataLabels: {
    enabled: true,
    formatter: function () {
        return parseFloat(this.y.toFixed(2)).toLocaleString();
    }
}
...

Wenn Sie nicht möchten, dass die Nummer mit einem Komma-Trennzeichen endet (abhängig vom Gebietsschema), entfernen Sie .toLocaleString (). 

Sidenote: Leider ist die Verwendung von format (anstelle von formatatter und einer js-Funktion wie oben beschrieben) auf eine Teilmenge von float - Formatierungskonventionen der C-Bibliotheksfunktion sprintf beschränkt, wie angegeben hier auf der Highcharts-Website . Diese Bibliothek hat den Code g , der dies automatisch für uns tun würde, aber leider ist sie nicht in Highcharts implementiert :(, d. H. Format: '{point.y:,. 2g}' funktioniert nicht.

0
Mark Zhukovsky