Wie formatiert man Zahlen im Google API-Liniendiagramm?

7

Ich muss die Zahlen in der Achse formatieren und die Zahlen, die angezeigt werden, wenn Sie mit der Maus über das Liniendiagramm fahren.

    
hexicle 13.08.2013, 08:54
quelle

2 Antworten

29

Es gibt zwei Schritte. Der erste Schritt besteht darin, herauszufinden, welches Muster Sie verwenden sollten. Der zweite Schritt besteht darin, das Muster an die richtige Stelle in Ihrem Code zu setzen. Um diesen Beitrag schöner zu machen, zeige ich Ihnen Schritt 2 und dann Schritt 1.

Schritt 2: Setzen Sie das Muster in Ihren Code

Hier ist der Code:

%Vor%

vAxis: {title: 'Time', format:'0.0E00'} formatiert die Beschriftungen auf der vertikalen Achse.

Dies formatiert die Zahlen, die Sie sehen, wenn Sie den Mauszeiger über die Punkte im Liniendiagramm bewegen:

%Vor%

Beachten Sie, wie (dataTable,0) die hAxis-Informationen formatiert, während (dataTable,1) die vAxis-Informationen formatiert (wieder, wenn Sie den Mauszeiger über die Punkte im Liniendiagramm bewegen).

Die letzten zwei Codezeilen:

%Vor%

sind für Sie zwei vergleichen Sie mit Ihrem eigenen Diagramm. Ersetzen Sie fchartvar , dataTable und fchart durch die in Ihrem Code verwendeten Namen. Wenn Sie etwas anderes als Liniendiagramm verwenden, ersetzen Sie LineChart durch das Diagramm, das Sie verwenden.

Ein Beispiel für 0.0E00 verwandelt 1,234 in 1.2E03 .

Schritt 1: Das richtige Muster finden

Google NumberFormat-Dokumentation

NumberFormat unterstützt die folgenden Optionen, die an den Konstruktor übergeben werden: (Quelle: Google NumberFormat-Dokumentation )

DezimalSymbol

  • Ein Zeichen, das als Dezimaltrennzeichen verwendet werden soll. Der Standardwert ist ein Punkt (.).

fractionDigits

  • Eine Zahl, die angibt, wie viele Ziffern nach dem Dezimaltrennzeichen angezeigt werden sollen. Das Der Standardwert ist 2. Wenn Sie mehr Ziffern angeben, als die Zahl enthält, ist dies der Fall zeigt Nullen für die kleineren Werte an. Abgeschnittene Werte werden sein abgerundet (5 aufgerundet).

Gruppierungssymbol

  • Ein Zeichen zum Gruppieren von Ziffern links vom Dezimaltrennzeichen in Dreiergruppen. Standard ist ein Komma (,).

negativeFarbe

  • Die Textfarbe für negative Werte. Kein Standardwert Werte können sein jeden akzeptablen HTML-Farbwert, wie "rot" oder "# FF0000".

negativeParens

  • Ein boolescher Wert, wobei true anzeigt, dass negative Werte sein sollten umgeben von Klammern. Der Standardwert ist wahr.

Muster

  • Eine Formatzeichenfolge. Wenn angegeben, werden alle anderen Optionen ignoriert, außer negativeColor.

    Die Formatzeichenfolge ist eine Teilmenge der ICU-Mustergruppe . Zum Beispiel, {pattern: '#, ###%'} ergibt die Ausgabewerte "1.000%", "750%" und "50%" für die Werte 10, 7,5 und 0,5.

Präfix

  • Ein Zeichenfolgenpräfix für den Wert, z. B. "$".

Suffix

  • Ein String-Suffix für den Wert, z. B. "%".

ICU DecimalFormat-Referenz

Wie Sie vielleicht bereits in der Google NumberFormat-Dokumentation bemerkt haben, können Sie detailliertere Informationen zum Formatieren der Zahlen aus der ICU DecimalFormat-Referenz herausfinden. Hier sind einige der wichtigsten Informationen aus der ICU DecimalFormat-Referenz (sie befindet sich in der Mitte des Webseite):

Ein DecimalFormat-Muster enthält ein postives und ein negatives Untermuster, z. B. "#, ## 0.00; (#, ## 0.00)". Jedes Untermuster hat ein Präfix, einen numerischen Teil und ein Suffix. Wenn es kein explizites negatives Untermuster gibt, ist das negative Untermuster das lokalisierte Minuszeichen, das dem positiven Untermuster vorangestellt ist. Das heißt, "0,00" allein entspricht "0,00; -0,00". Wenn es ein explizites negatives Untermuster gibt, dient es nur dazu, das negative Präfix und Suffix anzugeben; Die Anzahl der Ziffern, minimalen Ziffern und andere Merkmale werden im negativen Untermuster ignoriert. Das heißt, "#, ## 0.0 #; (#)" hat genau das gleiche Ergebnis wie "#, ## 0.0 #; (#, ## 0.0 #)".

Die Präfixe, Suffixe und verschiedenen Symbole, die für Unendlichkeit, Ziffern, Tausendertrennzeichen, Dezimaltrennzeichen usw. verwendet werden, können auf beliebige Werte gesetzt werden und werden während der Formatierung korrekt angezeigt. Es muss jedoch darauf geachtet werden, dass die Symbole und Zeichenfolgen nicht in Konflikt stehen oder dass das Parsen unzuverlässig ist. Zum Beispiel müssen entweder die positiven und negativen Präfixe oder die Suffixe für parse () unterschiedlich sein, um positive von negativen Werten unterscheiden zu können. Ein anderes Beispiel ist, dass das Dezimaltrennzeichen und das Tausendertrennzeichen getrennte Zeichen sein sollten oder das Parsen unmöglich ist.

Das Gruppierungstrennzeichen ist ein Zeichen, das Cluster von Ganzzahlziffern trennt, um größere Zahlen lesbarer zu machen. Es wird häufig für Tausende verwendet, aber in einigen Ländern trennt es Zehntausende. Die Gruppierungsgröße ist die Anzahl der Ziffern zwischen den Gruppierungstrennzeichen, z. B. 3 für "100.000.000" oder 4 für "1 0000 0000".Es gibt tatsächlich zwei verschiedene Gruppierungsgrößen: Eine für die niedrigstwertigen Integer-Ziffern, die primäre Gruppierungsgröße und eine für alle anderen, die zweite Gruppierungsgröße. In den meisten Ländern sind diese gleich, manchmal sind sie jedoch unterschiedlich. Wenn das primäre Gruppierungsintervall beispielsweise 3 ist und das sekundäre Gruppierungsintervall 2 ist, entspricht dies dem Muster "#, ##, ## 0", und die Nummer 123456789 ist als "12,34,56,789" formatiert. Wenn ein Muster mehrere Gruppierungstrennzeichen enthält, definiert das Intervall zwischen dem letzten und dem Ende der Ganzzahl die primäre Gruppierungsgröße, und das Intervall zwischen den letzten beiden definiert die sekundäre Gruppierungsgröße. Alle anderen werden ignoriert, also "#, ##, ###, ####" == "###, ###, ####" == "##, #, ###, # ### ".

Illegale Muster wie "#. #. #" oder "#. ###, ###" bewirken, dass DecimalFormat einen fehlerhaften UErrorCode setzt.

    
hexicle 13.08.2013, 08:54
quelle
2

Wenn Sie alle in der Grafik gezeigten Zahlen einfach im Hover und in der Achse entsprechend dem Gebietsschema eines Landes formatieren müssen, ist IMHO der einfachste, beim Laden der Bibliothek den Ländercode zu verwenden.

Zum Beispiel:

  

google.charts.load ('44 ', {packages: [' core chart ',' bar ',' sankey '],' sprache ':' fr '});

Auf diese Weise würde ich alle Zahlen mit Leerzeichen als Trennzeichen für Tausende und einem Komma für die Dezimalstelle formatieren.

    
BuckBazooka 19.10.2016 11:11
quelle

Tags und Links