Visualisierung: Säulendiagramm

Die Dauer der Animation in Millisekunden. Weitere Informationen finden Sie in der Animationsdokumentation.

Die auf die Animation angewendete Easing-Funktion. Folgende Optionen sind verfügbar:

• 'linear' - Konstante Geschwindigkeit.
• 'In' - Ease-In - Startet langsam und beschleunigt.
• 'out' - Ease Out - Startet schnell und verlangsamt.
• „inAndOut“ – Einfach ein- und ausschalten – langsam starten, beschleunigen und verlangsamen

Bestimmt, ob das Diagramm bei der ersten Zeichnung animiert wird. Bei true beginnt das Diagramm in der Referenz und wird in den endgültigen Zustand animiert.

In Balkendiagrammen und Spaltendiagrammen werden, sofern sie auf true gesetzt sind, alle Annotationen außerhalb der Balken- bzw. Spalte gezeichnet.

In Diagrammen, die Annotationen unterstützen, steuert das annotations.boxStyle-Objekt die Darstellung der Felder, die Annotationen enthalten:

var options = {
  annotations: {
    boxStyle: {
      // Color of the box outline.
      stroke: '#888',
      // Thickness of the box outline.
      strokeWidth: 1,
      // x-radius of the corner curvature.
      rx: 10,
      // y-radius of the corner curvature.
      ry: 10,
      // Attributes for linear gradient fill.
      gradient: {
        // Start color for gradient.
        color1: '#fbf6a7',
        // Finish color for gradient.
        color2: '#33b679',
        // Where on the boundary to start and
        // end the color1/color2 gradient,
        // relative to the upper left corner
        // of the boundary.
        x1: '0%', y1: '0%',
        x2: '100%', y2: '100%',
        // If true, the boundary for x1,
        // y1, x2, and y2 is the box. If
        // false, it's the entire chart.
        useObjectBoundingBoxUnits: true
      }
    }
  }
};
    

Diese Option wird derzeit für Flächen-, Balken-, Säulen-, Kombinations-, Linien- und Streudiagramme unterstützt. Es wird vom Anmerkungsdiagramm nicht unterstützt.

var options = {
  annotations: {
    textStyle: {
      fontName: 'Times-Roman',
      fontSize: 18,
      bold: true,
      italic: true,
      // The color of the text.
      color: '#871b47',
      // The color of the text outline.
      auraColor: '#d799ae',
      // The transparency of the text.
      opacity: 0.8
    }
  }
};
    

Diese Option wird derzeit für Flächen-, Balken-, Säulen-, Kombinations-, Linien- und Streudiagramme unterstützt. Es wird im Anmerkungsdiagramm nicht unterstützt.

Position der Achsentitel im Vergleich zum Diagrammbereich. Unterstützte Werte:

• in : Zeichnen Sie die Achsentitel innerhalb des Diagrammbereichs.
• Out - Zeichnen Sie die Achsentitel außerhalb des Diagrammbereichs.
• Keine: Titel der Achsen weglassen

Die Hintergrundfarbe für den Hauptbereich des Diagramms. Kann ein einfacher HTML-Farbstring sein, z. B. 'red' oder '#00cc00', oder ein Objekt mit den folgenden Eigenschaften.

Die Farbe des Diagrammrahmens als HTML-Farbstring.

Die Rahmenbreite in Pixeln.

Die Füllfarbe des Diagramms als HTML-Farbstring.

• Pixel (z. B. 50)
• Prozentsatz der verfügbaren Breite für jede Gruppe (z. B. „20 %“). „100 %“ bedeutet, dass zwischen ihnen kein Leerzeichen steht.

Gibt an, ob die Balken in einem Material-Balkendiagramm vertikal oder horizontal sind. Diese Option hat keine Auswirkungen auf klassische Balkendiagramme oder klassische Säulendiagramme.

Ein Objekt mit Mitgliedern zum Konfigurieren der Platzierung und Größe des Diagrammbereichs (wo das Diagramm selbst gezeichnet wird, ohne Achse und Legenden). Es werden zwei Formate unterstützt: eine Zahl oder eine Zahl gefolgt von %. Eine einfache Zahl ist ein Wert in Pixeln. Eine Zahl gefolgt von % ist ein Prozentsatz. Beispiel: chartArea:{left:20,top:0,width:'50%',height:'75%'}

• stroke: Die Farbe, angegeben als Hexadezimalstring oder englische Farbbezeichnung.
• strokeWidth: zeichnet, sofern angegeben, einen Rahmen um den Diagrammbereich der angegebenen Breite (und in der Farbe stroke).

Gibt an, wie weit das Diagramm vom linken Rand gezeichnet werden soll.

Gibt an, wie weit das Diagramm vom oberen Rand aus gezeichnet werden soll.

Breite des Diagrammbereichs.

Höhe des Diagrammbereichs.

Bei Material-Diagrammen gibt diese Option den Untertitel an. Untertitel werden nur in Material-Charts unterstützt.

Bei Material-Diagrammen gibt diese Option den Titel an.

Die für die Diagrammelemente zu verwendenden Farben. Ein Array von Strings, wobei jedes Element ein HTML-Farbstring ist, zum Beispiel colors:['red','#004411'].

Die Transparenz von Datenpunkten, wobei 1.0 vollständig deckend und 0.0 vollständig transparent ist. In Streu-, Histogramm-, Balken- und Spaltendiagrammen bezieht sich dies auf die sichtbaren Daten: Punkte im Streudiagramm und Rechtecke in den anderen. In Diagrammen, in denen bei der Auswahl von Daten ein Punkt erstellt wird, z. B. eines Linien- oder Flächendiagramms, bezieht sich dies auf die Kreise, die angezeigt werden, wenn der Mauszeiger darauf bewegt oder ausgewählt wird. Das Kombinationsdiagramm zeigt beide Verhaltensweisen. Diese Option hat keine Auswirkungen auf andere Diagramme. Informationen zum Ändern der Deckkraft einer Trendlinie finden Sie unter Trendliniendeckkraft.

Gibt an, ob das Diagramm nutzerbasierte Ereignisse auslöst oder auf Nutzerinteraktionen reagiert. Bei „false“ wird im Diagramm kein „select“-Ereignis oder ein anderes interaktionsbasiertes Ereignis ausgelöst. Stattdessen werden Ready- oder Error-Ereignisse ausgelöst. Außerdem wird je nach Nutzereingabe kein Hover-Text angezeigt oder anderweitig geändert.

Mit der Option explorer können Nutzer schwenken und zoomen. explorer: {} bietet das Standardverhalten für Explorer, mit dem Nutzer horizontal und vertikal durch Ziehen schwenken und durch Zoomen heran- und herauszoomen können.

Diese Funktion ist experimentell und kann sich in zukünftigen Releases ändern.

Hinweis: Der Explorer funktioniert nur mit fortlaufenden Achsen (z. B. Zahlen oder Datumsangaben).

Der Google Charts-Explorer unterstützt drei Aktionen:

• dragToPan: Durch Ziehen lässt sich das Diagramm horizontal und vertikal verschieben. Wenn Sie nur auf der horizontalen Achse schwenken möchten, verwenden Sie explorer: { axis: 'horizontal' }. Das Gleiche gilt für die vertikale Achse.
• dragToZoom: Das Standardverhalten des Explorers ist das Heran- und Herauszoomen, wenn der Nutzer scrollt. Wenn explorer: { actions: ['dragToZoom', 'rightClickToReset'] } verwendet wird, wird dieser Bereich durch Ziehen an einem rechteckigen Bereich vergrößert. Wir empfehlen die Verwendung von rightClickToReset, wenn dragToZoom verwendet wird. Informationen zu Zoomanpassungen finden Sie unter explorer.maxZoomIn, explorer.maxZoomOut und explorer.zoomDelta.
• rightClickToReset: Wenn Sie mit der rechten Maustaste auf das Diagramm klicken, wird es auf die ursprüngliche Schwenk- und Zoomstufe zurückgesetzt.

Standardmäßig können Nutzer sowohl horizontal als auch vertikal schwenken, wenn die Option explorer verwendet wird. Wenn Nutzer nur horizontal schwenken sollen, verwenden Sie explorer: { axis: 'horizontal' }. Ebenso ermöglicht explorer: { axis: 'vertical' } das ausschließliche Schwenken.

Standardmäßig können Nutzer schwenken, unabhängig davon, wo sich die Daten befinden. Verwenden Sie explorer: { keepInBounds: true }, um sicherzustellen, dass Nutzer das Diagramm nicht über das ursprüngliche Diagramm hinaus schwenken.

Das Maximum, das der Explorer heranzoomen kann. Standardmäßig können Nutzer heranzoomen, sodass sie nur 25% der Originalansicht sehen. Wenn Sie explorer: { maxZoomIn: .5 } festlegen, können Nutzer nur weit genug heranzoomen, um die Hälfte der Originalansicht zu sehen.

Das Maximum, das der Explorer herauszoomen kann. Standardmäßig können Nutzer weit herauszoomen, sodass das Diagramm nur ein Viertel des verfügbaren Platzes einnimmt. Wenn Sie explorer: { maxZoomOut: 8 } festlegen, können Nutzer weit herauszoomen, sodass das Diagramm nur 1/8 des verfügbaren Platzes einnimmt.

Wenn Nutzer heran- oder herauszoomen, legt explorer.zoomDelta fest, um wie viel sie heranzoomen möchten. Je kleiner die Zahl, desto flüssiger und langsamer ist der Zoom.

Der Typ der Entität, die den Fokus auf den Mauszeiger bewegt Betrifft außerdem, welche Entität per Mausklick ausgewählt wird und welches Datentabellenelement mit Ereignissen verknüpft ist. Folgende Typen sind möglich:

• „Datum“: Fokus auf einen einzelnen Datenpunkt Korreliert mit einer Zelle in der Datentabelle.
• 'Kategorie': Wählen Sie eine Gruppierung aller Datenpunkte entlang der Hauptachse aus. Korreliert zu einer Zeile in der Datentabelle.

In der fokussierten Kategorie „category“ werden alle Kategoriewerte angezeigt. Dies kann nützlich sein, um Werte verschiedener Serien zu vergleichen.

Die Standardschriftgröße des gesamten Textes im Diagramm in Pixeln. Sie können dies mit Attributen für bestimmte Diagrammelemente überschreiben.

Die Standardschriftart für den gesamten Text im Diagramm. Sie können dies mit Attributen für bestimmte Diagrammelemente überschreiben.

Zeichnet das Diagramm innerhalb eines Inline-Frames. Beachten Sie, dass diese Option im IE8 ignoriert wird. Alle IE8-Diagramme werden in iFrames gezeichnet.

Ein Objekt mit Mitgliedern zur Konfiguration verschiedener horizontaler Achsenelemente Zur Angabe von Attributen dieses Objekts können Sie die Objektliteralschreibweise verwenden, wie hier gezeigt:

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    

Der Ausgangswert für die horizontale Achse.

Diese Option wird nur für eine continuous-Achse unterstützt.

Die Farbe der Referenzlinie für die horizontale Achse. Kann ein beliebiger HTML-Farbstring sein, z. B. 'red' oder '#00cc00'.

Diese Option wird nur für eine continuous-Achse unterstützt.

Die Richtung, in der die Werte entlang der horizontalen Achse wachsen. Geben Sie -1 an, um die Reihenfolge der Werte umzukehren.

Ein Formatstring für Labels vom Typ „numerisch“ oder „Datumsachse“.

Bei Labels für die Zahlenachse ist dies eine Teilmenge des Dezimalformatierungs-Intensitätsmustersatzes. Für {format:'#,###%'} werden beispielsweise die Werte „1.000 %“, „750 %“ und „50 %“ für die Werte 10, 7.5 und 0,5 angezeigt. Sie können auch Folgendes angeben:

• {format: 'none'}: Zeigt Zahlen ohne Formatierung an (z.B. 8.000.000)
• {format: 'decimal'}: Zeigt Zahlen mit Tausenden von Trennzeichen an (z.B. 8.000.000)
• {format: 'scientific'}: Zeigt Zahlen in wissenschaftlicher Notation (z.B. 8e6)
• {format: 'currency'}: Zeigt Zahlen in der Landeswährung an (z.B. 8.000.000,00 $)
• {format: 'percent'}: Zeigt Zahlen in Prozent an (z.B. 800.000.000%)
• {format: 'short'}: Abgekürzte Zahlen (z.B. 8 Mio.)
• {format: 'long'}: Die Zahlen werden als vollständige Wörter angezeigt, z.B. 8 Millionen)

Bei Labels für die Datumsachse handelt es sich um eine Teilmenge des Datumsformats ICU-Mustersatz . Beispiel: {format:'MMM d, y'} zeigt den Wert „1. Juli 2011“ für den 1. Juli 2011 an.

Die tatsächliche Formatierung des Labels wird aus dem Gebietsschema abgeleitet, mit dem die API geladen wurde. Weitere Informationen finden Sie unter Diagramme mit einer bestimmten Sprache laden.

Bei der Berechnung von Tick-Werten und Gitternetzlinien werden mehrere alternative Kombinationen aller relevanten Gitternetzlinien-Optionen berücksichtigt und Alternativen abgelehnt, wenn die formatierten Teilstrich-Labels dupliziert werden oder sich überschneiden. Sie können also format:"#" angeben, wenn Sie nur Ganzzahlwerte anzeigen möchten. Wenn keine Alternative diese Bedingung erfüllt, werden keine Gitternetzlinien oder Teilstriche angezeigt.

Diese Option wird nur für die Achse continuous unterstützt.

Ein Objekt mit Eigenschaften zum Konfigurieren der Gitternetzlinien auf der horizontalen Achse. Beachten Sie, dass die Gitternetzlinien für die horizontale Achse vertikal gezeichnet sind. Zur Angabe von Attributen dieses Objekts können Sie die Objektliteralschreibweise verwenden, wie hier gezeigt:

{color: '#333', minSpacing: 20}

Diese Option wird nur für die Achse continuous unterstützt.

Die Farbe der horizontalen Gitternetzlinien im Diagrammbereich. Gib einen gültigen HTML-Farbstring an.

Die ungefähre Anzahl horizontaler Gitternetzlinien im Diagrammbereich. Wenn Sie für gridlines.count eine positive Zahl angeben, wird damit die minSpacing zwischen den Gitternetzlinien berechnet. Sie können den Wert 1 angeben, wenn nur eine Gitternetzlinie gezeichnet werden soll, oder 0, um keine Gitternetzlinien zu zeichnen. Geben Sie den Standardwert „-1“ an, um die Anzahl der Gitternetzlinien auf der Grundlage anderer Optionen automatisch zu berechnen.

Ein Array von Größen (als Datenwerte, nicht Pixel) zwischen benachbarten Gitternetzlinien. Diese Option ist derzeit nur für numerische Achsen verfügbar, entspricht jedoch den Optionen gridlines.units.<unit>.interval, die nur für Datum und Uhrzeit verwendet werden. Bei linearen Skalen ist der Standardwert [1, 2, 2.5, 5].Das bedeutet, dass die Gitternetzlinienwerte auf jede Einheit (1), auf geraden Einheiten (2) oder auf ein Vielfaches von 2,5 oder 5 fallen können. Potenz von 10-fachem Wert wird ebenfalls berücksichtigt (z.B. [10, 20, 25, 50] und [.1, .2, .25, .5]). Für Logskalierungen ist der Standardwert [1, 2, 5].

Der minimale Bildschirmabstand in Pixeln zwischen den Hauptgitternetzlinien in hAxis. Der Standardwert für große Gitternetzlinien ist 40 für lineare Skalen und 20 für Logskalierungen. Wenn Sie die count und nicht die minSpacing angeben, wird der minSpacing aus der Anzahl berechnet. Wenn Sie umgekehrt minSpacing und nicht count angeben, wird die Anzahl anhand der minSpacing berechnet. Wenn Sie beides angeben, überschreibt minSpacing den Wert.

Alle Gitternetz- und Teilstrichwerte müssen ein Vielfaches des Werts dieser Option sein. Beachten Sie, dass im Gegensatz zu Intervallen das Zehnfache des Vielfachen nicht berücksichtigt wird. Sie können z. B. erzwingen, dass Ticks als Ganzzahlen angegeben werden, oder erzwingen, dass Ticks ein Vielfaches von 1.000 sind, wenn Sie gridlines.multiple = 1000 angeben.

Überschreibt das Standardformat für verschiedene Aspekte von Datentypen für Datum/Datum/Uhrzeit, wenn es mit berechneten Gitternetzlinien verwendet wird. Ermöglicht die Formatierung für Jahre, Monate, Tage, Stunden, Minuten, Sekunden und Millisekunden.

Allgemeines Format:

gridlines: {
  units: {
    years: {format: [/*format strings here*/]},
    months: {format: [/*format strings here*/]},
    days: {format: [/*format strings here*/]}
    hours: {format: [/*format strings here*/]}
    minutes: {format: [/*format strings here*/]}
    seconds: {format: [/*format strings here*/]},
    milliseconds: {format: [/*format strings here*/]},
  }
}
    

Weitere Informationen finden Sie unter Datum und Uhrzeit.

Ein Objekt mit Mitgliedern, um die kleinen Gitternetzlinien auf der horizontalen Achse zu konfigurieren, ähnlich der Option „hAxis.gridlines“.

Diese Option wird nur für die Achse continuous unterstützt.

Die Farbe der horizontalen kleinen Gitternetzlinien im Diagrammbereich. Gib einen gültigen HTML-Farbstring an.

Die Option minorGridlines.count ist größtenteils veraltet, mit Ausnahme der Deaktivierung kleinerer Gitternetzlinien durch Festlegen der Anzahl auf 0. Die Anzahl der Nebengitternetze hängt jetzt vollständig vom Intervall zwischen den Hauptgitternetzlinien (siehe hAxis.gridlines.interval) und dem erforderlichen Mindestbereich ab (siehe hAxis.minorGridlines.minSpacing).

Die Option „Nebengrills.interval“ entspricht der Intervalloption für die Hauptgitternetzlinien. Das ausgewählte Intervall ist jedoch immer ein gleichmäßiger Teiler des Hauptgitternetzintervalls. Das Standardintervall für lineare Skalen ist [1, 1.5, 2, 2.5, 5] und für Logskalierungen [1, 2, 5].

Der erforderliche Mindestabstand in Pixeln zwischen benachbarten kleinen Gitternetzlinien und zwischen kleinen und großen Gitternetzlinien. Der Standardwert ist 1/2 des minSpacing der Hauptgitterlinien für lineare Skalen und 1/5 des minSpacing für Logskalierungen.

Wie bei der gridlines.multiple.

Überschreibt das Standardformat für verschiedene Aspekte von Datentypen für Datum/Datum/Uhrzeit, wenn es mit im Diagramm berechneten Minderjährigen verwendet wird. Ermöglicht die Formatierung für Jahre, Monate, Tage, Stunden, Minuten, Sekunden und Millisekunden.

Allgemeines Format:

gridlines: {
  units: {
    years: {format: [/*format strings here*/]},
    months: {format: [/*format strings here*/]},
    days: {format: [/*format strings here*/]}
    hours: {format: [/*format strings here*/]}
    minutes: {format: [/*format strings here*/]}
    seconds: {format: [/*format strings here*/]},
    milliseconds: {format: [/*format strings here*/]},
  }
}
    

Weitere Informationen finden Sie unter Datum und Uhrzeit.

hAxis-Attribut, das die horizontale Achse zu einer logarithmischen Skala macht. Alle Werte müssen positiv sein. Für „yes“ den Wert „true“ festlegen.

Diese Option wird nur für eine continuous-Achse unterstützt.

hAxis-Eigenschaft, die die horizontale Achse zu einer logarithmischen Skala macht. folgende Arten von Werten sind möglich:

• null: Es wird keine logarithmische Skalierung durchgeführt.
• „log“ – Logarithmische Skalierung. Negative und Nullwerte werden nicht dargestellt. Diese Option entspricht der Einstellung hAxis: { logscale: true }.
• „mirrorLog“ – Logarithmische Skalierung, in der negative und Nullwerte dargestellt werden. Der dargestellte Wert einer negativen Zahl ist das negative Ergebnis des Logwerts des absoluten Werts. Werte nahe 0 werden auf einer linearen Skala dargestellt.

Diese Option wird nur für eine continuous-Achse unterstützt.

Position des Texts auf der horizontalen Achse relativ zum Diagrammbereich. Unterstützte Werte: „out“, „in“ und „none“.

Ein Objekt, das den Textstil der horizontalen Achse angibt. Das Objekt hat folgendes Format:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color kann ein beliebiger HTML-Farbstring sein, z. B. 'red' oder '#00cc00'. Siehe auch fontName und fontSize.

Ersetzt die automatisch generierten X-Achsen-Ticks durch das angegebene Array. Jedes Element des Arrays muss entweder ein gültiger Tickwert (z. B. eine Zahl, ein Datum, ein Datum oder eine Uhrzeit) oder ein Objekt sein. Wenn es sich um ein Objekt handelt, sollte es die Eigenschaft v für den Tickwert und eine optionale f-Eigenschaft mit dem Literalstring haben, der als Label angezeigt werden soll.

Das viewWindow wird automatisch um die Mindest- und Höchstwerte erweitert, es sei denn, Sie geben viewWindow.min oder viewWindow.max zum Überschreiben an.

Beispiele:

• hAxis: { ticks: [5,10,15,20] }
• hAxis: { ticks: [{v:32, f:'thirty two'}, {v:64, f:'sixty four'}] }
• hAxis: { ticks: [new Date(2014,3,15), new Date(2013,5,15)] }
• hAxis: { ticks: [16, {v:32, f:'thirty two'}, {v:64, f:'sixty four'}, 128] }

Diese Option wird nur für die Achse continuous unterstützt.

hAxis-Attribut, das den Titel der horizontalen Achse angibt.

Ein Objekt, das den Titeltext der horizontalen Achse angibt. Das Objekt hat folgendes Format:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color kann ein beliebiger HTML-Farbstring sein, z. B. 'red' oder '#00cc00'. Siehe auch fontName und fontSize.

Bei „false“ werden äußerste Labels ausgeblendet, anstatt zu erlauben, dass sie vom Diagrammcontainer abgeschnitten werden. Bei „true“ ist das Zuschneiden von Labels zulässig.

Diese Option wird nur für eine discrete-Achse unterstützt.

Wenn dieser Wert auf „true“ gesetzt ist, zeichnen Sie den Text der horizontalen Achse schräg, damit mehr Text entlang der Achse passt. Falls falsch, zeichnen Sie den Text der horizontalen Achse aufrecht. Standardmäßig ist der Text schräg, wenn er nicht aufrecht dargestellt werden kann. Diese Option ist nur verfügbar, wenn hAxis.textPosition auf „out“ (Standard) gesetzt ist. Der Standardwert für Datumsangaben und Uhrzeiten ist false.

Der Winkel des Texts der horizontalen Achse, wenn er schräg gezeichnet wird. Wird ignoriert, wenn hAxis.slantedText den Wert false hat oder sich im automatischen Modus befindet und das Diagramm den Text horizontal zeichnet. Bei einem positiven Winkel ist die Drehung entgegen dem Uhrzeigersinn und bei einem negativen Winkel im Uhrzeigersinn.

Maximale Anzahl der Ebenen des Textes der horizontalen Achse. Wenn Textlabels für Achsen zu voll werden, kann der Server benachbarte Labels verschieben, um sie näher aneinander zu halten. Dieser Wert gibt die höchste Anzahl von Ebenen an. Der Server kann weniger Ebenen verwenden, wenn die Labels keine Überschneidungen haben. Für Datum und Uhrzeit ist die Standardeinstellung 1.

Maximal zulässige Zeilenanzahl für die Textlabels. Labels können sich über mehrere Zeilen erstrecken, wenn sie zu lang sind und die Anzahl der Zeilen standardmäßig durch die Höhe des verfügbaren Platzes begrenzt ist.

Der minimale horizontale Abstand in Pixeln zwischen zwei benachbarten Textlabels. Wenn die Labels zu dicht beieinander liegen oder zu lang sind, kann der Abstand unter diesen Grenzwert fallen. In diesem Fall wird eine der Maßnahmen zum Entfernen von Labels angewendet, z. B. werden die Labels abgeschnitten oder einige von ihnen werden entfernt.

Gibt an, wie viele Labels der horizontalen Achse angezeigt werden, wobei 1 für jedes Label steht, 2 für alle anderen Labels usw. Standardmäßig wird versucht, so viele Labels wie möglich anzuzeigen, ohne sich zu überschneiden.

Verschiebt den Maximalwert der horizontalen Achse auf den angegebenen Wert. Dies ist bei den meisten Diagrammen rechts. Wird ignoriert, wenn dieser Wert kleiner als der maximale x-Wert der Daten ist. hAxis.viewWindow.max überschreibt diese Property.

Diese Option wird nur für die Achse continuous unterstützt.

Verschiebt den Mindestwert der horizontalen Achse auf den angegebenen Wert. In den meisten Diagrammen wird dieser Wert auf der linken Seite angezeigt. Wird ignoriert, wenn dieser Wert größer als der minimale x-Wert der Daten ist. hAxis.viewWindow.min überschreibt diese Property.

Diese Option wird nur für die Achse continuous unterstützt.

Gibt an, wie die horizontale Achse skaliert werden soll, um die Werte im Diagrammbereich zu rendern. Die folgenden Stringwerte werden unterstützt:

• „pretty“ – Skalieren Sie die horizontalen Werte so, dass die Maximal- und Minimalwerte innerhalb des linken und rechten Diagrammbereichs etwas gerendert werden. Das viewWindow wird auf die nächste Hauptrasterlinie für Zahlen oder die nächste Nebengitterlinie für Datumsangaben und Uhrzeiten erweitert.
• „maximized“ (maximiert): Die horizontalen Werte werden so skaliert, dass die Maximal- und Minimalwerte den linken und rechten Rand des Diagrammbereichs berühren. Dadurch werden haxis.viewWindow.min und haxis.viewWindow.max ignoriert.
• „explicit“ – veraltete Option zum Angeben der linken und rechten Skalierungswerte des Diagrammbereichs. (Veraltet, da es mit haxis.viewWindow.min und haxis.viewWindow.max redundant ist.) Datenwerte außerhalb dieser Werte werden zugeschnitten. Du musst ein hAxis.viewWindow-Objekt angeben, das die Höchst- und Mindestwerte für die Anzeige angibt.

Diese Option wird nur für die Achse continuous unterstützt.

Gibt den Zuschneidebereich der horizontalen Achse an.

• Für eine continuous-Achse:

  Der maximale horizontale Datenwert, der gerendert werden soll.

• Für eine discrete-Achse:

  Der nullbasierte Zeilenindex, bei dem das Zuschneidefenster endet. Datenpunkte ab diesem Index werden abgeschnitten. In Verbindung mit vAxis.viewWindowMode.min definiert es einen halb geöffneten Bereich [min, max), der die anzuzeigenden Elementindexe angibt. Das heißt, jeder Index wird so angezeigt, dass min <= index < max angezeigt wird.

Wird ignoriert, wenn hAxis.viewWindowMode „pretty“ oder „maximiert“ ist.

• Für eine continuous-Achse:

  Der minimale horizontale Datenwert, der gerendert werden soll.

• Für eine discrete-Achse:

  Der nullbasierte Zeilenindex, bei dem das Zuschneidefenster beginnt. Datenpunkte an Indizes, die darunter liegen, werden abgeschnitten. In Verbindung mit vAxis.viewWindowMode.max definiert es einen halb geöffneten Bereich [min, max), der die anzuzeigenden Elementindexe angibt. Das heißt, jeder Index wird so angezeigt, dass min <= index < max angezeigt wird.

Wird ignoriert, wenn hAxis.viewWindowMode „pretty“ oder „maximiert“ ist.

Höhe des Diagramms in Pixeln.

Wenn dieser Wert auf „true“ gesetzt ist, werden die Elemente für alle Reihen bei jedem Domainwert gestapelt. Hinweis:In Diagrammen, Flächenformaten und SteppedArea-Diagrammen wird die Reihenfolge der Legendenelemente in Google Charts umgekehrt. Dies entspricht der Positionierung der Reihenelemente (z. B. Reihe 0 ist das unterste Legendenelement). Dies gilt nicht für Balkendiagramme.

Die Option isStacked unterstützt auch 100 %-Stapel, wobei die Stapel von Elementen bei jedem Domainwert neu skaliert werden, sodass die Summe 100 % ergibt.

isStacked bietet folgende Optionen:

• false: Die Elemente werden nicht gestapelt. Das ist die Standardeinstellung.
• true: Stackt Elemente für alle Reihen bei jedem Domainwert.
• 'percent': Stackt Elemente für alle Reihen bei jedem Domainwert und skaliert sie so, dass sie insgesamt 100 % ergeben, wobei der Wert jedes Elements als Prozentsatz von 100 % berechnet wird.
• 'relative': stapelt Elemente für alle Reihen an jedem Domainwert und skaliert sie so, dass sie insgesamt 1 ergeben, wobei der Wert jedes Elements als Bruchzahl 1 berechnet wird.
• 'absolute': Funktioniert wie isStacked: true.

Bei einer Stapelverarbeitung wird der berechnete Wert für jedes Element in der Kurzinfo nach dem tatsächlichen Wert angezeigt.

Die Zielachse wird standardmäßig auf Grundlage der relativen Skala von 0 bis 1 als Bruchteile von 1 für 'relative' und 0 bis 100% für 'percent' gesetzt. (Hinweis: Wenn Sie die Option 'percent' verwenden, werden die Werte für die Achsen und Teilstriche in Prozent angegeben. Die tatsächlichen Werte sind jedoch die relativen Skalenwerte von 0 bis 1. Der Grund hierfür ist, dass die Teilpunkte der Achse auch das Format „#.##%“ auf die relativen Skalawerte von 0–1 anwenden. Wenn Sie isStacked: 'percent' verwenden, achten Sie darauf, Tick-/Rasterlinien mit den relativen Skalawerten von 0–1 anzugeben. Sie können die Gitternetzlinien/Tickwerte und die Formatierung mithilfe der entsprechenden hAxis/vAxis-Optionen anpassen.

Ein 100 %-Stapel unterstützt nur Datenwerte vom Typ number und muss eine Baseline von null haben.

Ein Objekt mit Mitgliedern zur Konfiguration verschiedener Aspekte der Legende. Zur Angabe von Attributen dieses Objekts können Sie die Objektliteralschreibweise verwenden, wie hier gezeigt:

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}

Anfänglich ausgewählter nullbasierter Seitenindex der Legende.

Position der Legende. folgende Arten von Werten sind möglich:

• 'bottom' – unter dem Diagramm.
• „left“: Links neben dem Diagramm, sofern der linken Achse keine Reihen zugeordnet sind. Wenn die Legende also links angezeigt werden soll, verwenden Sie die Option targetAxisIndex: 1.
• 'In': Innerhalb des Diagramms, links oben.
• „Keine“: Es wird keine Legende angezeigt.
• „right“: rechts neben dem Diagramm Nicht mit der Option vAxes kompatibel.
• 'Oben': Oberhalb des Diagramms.

Ausrichtung der Legende. folgende Arten von Werten sind möglich:

• „start“: Auf den Anfang der Fläche ausgerichtet, die für die Legende zugewiesen ist.
• „center“ – zentriert im Bereich, der der Legende zugewiesen ist
• 'Ende': Ausgerichtet am Ende des Bereichs, der der Legende zugewiesen ist.

Anfang, Mittelpunkt und Ende sind relativ zum Stil der Legende (vertikal oder horizontal). In der Legende „Rechts“ befinden sich „Start“ und „Ende“ oben bzw. unten. Bei einer Legende „Oben“ befinden sich „Start“ bzw. „Ende“ am linken bzw. rechten Rand des Bereichs.

Der Standardwert hängt von der Position der Legende ab. Für Legenden des Typs "Unten" lautet die Standardeinstellung "Mitte", andere Legenden standardmäßig "Anfang".

Ein Objekt, das den Legendentextstil angibt. Das Objekt hat folgendes Format:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color kann ein beliebiger HTML-Farbstring sein, z. B. 'red' oder '#00cc00'. Siehe auch fontName und fontSize.

Die Ausrichtung des Diagramms. Wenn 'vertical' festgelegt ist, werden die Achsen des Diagramms so gedreht, dass (z. B.) ein Säulendiagramm zu einem Balkendiagramm wird und ein Flächendiagramm nach rechts statt nach oben wächst:

Wenn auf „true“ gesetzt, wird eine Reihe von rechts nach links gezeichnet. Standardmäßig wird von links nach rechts gezeichnet.

Diese Option wird nur für die Achse discrete major unterstützt.

Ein Array von Objekten, die jeweils das Format der entsprechenden Reihe im Diagramm beschreiben. Geben Sie ein leeres Objekt {} an, wenn Sie Standardwerte für eine Reihe verwenden möchten. Wenn keine Reihe oder kein Wert angegeben ist, wird der globale Wert verwendet. Jedes Objekt unterstützt die folgenden Eigenschaften:

• annotations: Ein Objekt, das auf Anmerkungen für diese Reihe angewendet wird. Hiermit lässt sich beispielsweise das textStyle für die Reihe steuern:

  series: {
    0: {
      annotations: {
        textStyle: {fontSize: 12, color: 'red' }
      }
    }
  }
            

  Eine ausführlichere Liste der möglichen Anpassungsoptionen findest du in den verschiedenen annotations-Optionen.

• color: Die für diese Reihe zu verwendende Farbe. Geben Sie einen gültigen HTML-Farbstring an.
• targetAxisIndex: Die Achse, der diese Reihe zugewiesen werden soll, wobei 0 die Standardachse und 1 die Gegenachse ist. Der Standardwert ist 0. Wird auf 1 festgelegt, um ein Diagramm zu definieren, in dem verschiedene Reihen an verschiedenen Achsen gerendert werden. Der Standardachse wurde mindestens eine Reihe zugewiesen. Sie können für verschiedene Achsen eine andere Skala definieren.
• visibleInLegend: Ein boolescher Wert, wobei "true" bedeutet, dass die Reihe einen Legendeneintrag enthalten sollte, und "false", dass dies nicht der Fall ist. Der Standardwert ist „true“.

Sie können entweder ein Array von Objekten angeben, von denen jedes auf die Reihe in der angegebenen Reihenfolge angewendet wird, oder ein Objekt angeben, bei dem jeder untergeordnete Schlüssel einen numerischen Schlüssel hat, der angibt, für welche Reihe sie gilt. Die folgenden beiden Deklarationen sind beispielsweise identisch und deklarieren die erste Reihe als schwarz und fehlen in der Legende und die vierte als rot und fehlt in der Legende:

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
    

Ein Design ist eine Gruppe vordefinierter Werte, die gemeinsam ein bestimmtes Diagrammverhalten oder einen bestimmten visuellen Effekt erzielen. Derzeit ist nur ein Design verfügbar:

• „maximiert“: maximiert den Bereich des Diagramms und zeichnet die Legende sowie alle Labels im Diagrammbereich. Legen Sie die folgenden Optionen fest:

  chartArea: {width: '100%', height: '100%'},
  legend: {position: 'in'},
  titlePosition: 'in', axisTitlesPosition: 'in',
  hAxis: {textPosition: 'in'}, vAxis: {textPosition: 'in'}
          

Text, der über dem Diagramm angezeigt werden soll.

Position des Diagramms im Vergleich zum Diagrammbereich. Unterstützte Werte:

• in : Zeichnen Sie den Titel in den Diagrammbereich.
• out: Zeichnen Sie den Titel außerhalb des Diagrammbereichs.
• Keine: Titel auslassen.

Ein Objekt, das den Stil des Titeltexts angibt. Das Objekt hat folgendes Format:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color kann ein beliebiger HTML-Farbstring sein, z. B. 'red' oder '#00cc00'. Siehe auch fontName und fontSize.

Ein Objekt mit Mitgliedern zum Konfigurieren verschiedener Kurzinfo-Elemente. Zur Angabe von Attributen dieses Objekts können Sie die Objektliteralschreibweise verwenden, wie hier gezeigt:

{textStyle: {color: '#FF0000'}, showColorCode: true}

Durch die Einstellung true wird das Zeichnen von Kurzinfos außerhalb der Grenzen des Diagramms auf allen Seiten zugelassen.

Hinweis:Das gilt nur für HTML-Kurzinfos. Wenn diese Option mit SVG-Kurzinfos aktiviert ist, werden alle Überläufe außerhalb der Diagrammgrenzen abgeschnitten. Weitere Informationen finden Sie unter Kurzinfos anpassen.

Wenn die Richtlinie auf „true“ gesetzt ist, werden HTML-gerenderte statt SVG-Kurzinfos verwendet. Weitere Informationen finden Sie unter Kurzinfos anpassen.

Hinweis:Die Anpassung der HTML-Kurzinfos über die Datenrolle der Kurzinfo-Spalte wird von der Visualisierung des Blasendiagramms nicht unterstützt.

Wenn dies der Fall ist, werden in der Kurzinfo farbige Quadrate neben den Reiheninformationen angezeigt. Die Standardeinstellung ist „true“, wenn focusTarget auf „category“ festgelegt ist. Andernfalls ist die Standardeinstellung „false“.

Ein Objekt, das den Textstil der Kurzinfo angibt. Das Objekt hat folgendes Format:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color kann ein beliebiger HTML-Farbstring sein, z. B. 'red' oder '#00cc00'. Siehe auch fontName und fontSize.

Die Nutzerinteraktion, die dazu führt, dass die Kurzinfo angezeigt wird:

• „Fokus“: Die Kurzinfo wird angezeigt, wenn der Nutzer den Mauszeiger auf das Element bewegt.
• „Keine“: Die Kurzinfo wird nicht angezeigt.
• „Auswahl“: Die Kurzinfo wird angezeigt, wenn der Nutzer das Element auswählt.

Zeigt in den Diagrammen, die diese unterstützen, Trendlinien an. Standardmäßig werden lineare Trendlinien verwendet. Dies kann jedoch mit der Option trendlines.n.type angepasst werden.

Trendlinien werden pro Reihe angegeben, die meisten Optionen sehen also so aus:

var options = {
  trendlines: {
    0: {
      type: 'linear',
      color: 'green',
      lineWidth: 3,
      opacity: 0.3,
      showR2: true,
      visibleInLegend: true
    }
  }
}
    

Die Farbe der Trendlinie, angegeben entweder als englischer Farbname oder als Hexadezimalstring.

Für Trendlinien von type: 'polynomial' der Grad des Polynoms (2 für Quadrat, 3 für Kubik usw.). (Der Standardgrad kann sich in einem zukünftigen Release von Google Charts von 3 in 2 ändern.)

Wenn diese Option festgelegt ist, wird die Trendlinie in der Legende als String angezeigt.

Die Linienbreite der Trendlinie in Pixeln.

Die Transparenz der Trendlinie von 0,0 (transparent) bis 1,0 (undurchsichtig).

Trendlinien werden durch das Stempeln mehrerer Punkte im Diagramm gebildet. Mit dieser selten benötigten Option können Sie die Größe der Punkte anpassen. In der Regel ist die Option lineWidth der Trendlinie zu bevorzugen. Diese Option ist jedoch erforderlich, wenn Sie die globale Option pointSize verwenden und eine andere Punktgröße für Ihre Trendlinien wünschen.

Trendlinien werden durch das Stempeln mehrerer Punkte auf dem Diagramm erstellt. Die Option pointsVisible der Trendlinie bestimmt, ob die Punkte für eine bestimmte Trendlinie sichtbar sind.

Gibt an, ob der Bestimmungskoeffizient in der Kurzinfo zur Legende oder Trendlinie angezeigt werden soll.

Gibt an, ob die Trendlinien 'linear' (Standardeinstellung), 'exponential' oder 'polynomial' sind.

Gibt an, ob die Trendliniengleichung in der Legende erscheint. Er wird in der Kurzinfo zur Trendlinie angezeigt.

Gibt die Eigenschaften für einzelne vertikale Achsen an, wenn das Diagramm über mehrere vertikale Achsen verfügt. Jedes untergeordnete Objekt ist ein vAxis-Objekt und kann alle von vAxis unterstützten Attribute enthalten. Diese Property-Werte überschreiben alle globalen Einstellungen für dieselbe Property.

Wenn Sie ein Diagramm mit mehreren vertikalen Achsen angeben möchten, definieren Sie zuerst mit series.targetAxisIndex eine neue Achse und konfigurieren Sie diese dann mit vAxes. Im folgenden Beispiel wird der rechten Achse die Reihe 2 zugewiesen und dafür ein benutzerdefinierter Titel und Textstil festgelegt:

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}
    

Diese Eigenschaft kann entweder ein Objekt oder ein Array sein: Das Objekt ist eine Sammlung von Objekten mit einem numerischen Label, das die von ihm definierte Achse angibt. Das ist das oben gezeigte Format. Das Array ist ein Array von Objekten, eines pro Achse. Die folgende Notation im Arraystil ist beispielsweise mit dem oben gezeigten vAxis-Objekt identisch:

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
    

Ein Objekt mit Mitgliedern zur Konfiguration verschiedener Elemente der vertikalen Achse Zur Angabe von Attributen dieses Objekts können Sie die Objektliteralschreibweise verwenden, wie hier gezeigt:

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}

vAxis-Attribut, das die Referenz für die vertikale Achse angibt. Wenn die Baseline größer als die höchste oder die unterste Rasterlinie ist, wird sie auf die nächste Rasterlinie gerundet.

Legt die Farbe der Referenzlinie für die vertikale Achse fest. Kann ein beliebiger HTML-Farbstring sein, z. B. 'red' oder '#00cc00'.

Die Richtung, in der die Werte entlang der vertikalen Achse wachsen. Standardmäßig befinden sich die unteren Werte im unteren Bereich des Diagramms. Geben Sie -1 an, um die Reihenfolge der Werte umzukehren.

Ein Formatstring für Labels der numerischen Achse Dies ist eine Teilmenge des ICU-Mustersatzes. Für {format:'#,###%'} werden beispielsweise die Werte „1.000 %“, „750 %“ und „50 %“ für die Werte 10, 7.5 und 0,5 angezeigt. Sie können auch Folgendes angeben:

• {format: 'none'}: Zeigt Zahlen ohne Formatierung an (z.B. 8.000.000)
• {format: 'decimal'}: Zeigt Zahlen mit Tausenden von Trennzeichen an (z.B. 8.000.000)
• {format: 'scientific'}: Zeigt Zahlen in wissenschaftlicher Notation (z.B. 8e6)
• {format: 'currency'}: Zeigt Zahlen in der Landeswährung an (z.B. 8.000.000,00 $)
• {format: 'percent'}: Zeigt Zahlen in Prozent an (z.B. 800.000.000%)
• {format: 'short'}: Abgekürzte Zahlen (z.B. 8 Mio.)
• {format: 'long'}: Die Zahlen werden als vollständige Wörter angezeigt, z.B. 8 Millionen)

Die tatsächliche Formatierung des Labels wird aus dem Gebietsschema abgeleitet, mit dem die API geladen wurde. Weitere Informationen finden Sie unter Diagramme mit einer bestimmten Sprache laden.

Bei der Berechnung von Tick-Werten und Gitternetzlinien werden mehrere alternative Kombinationen aller relevanten Gitternetzlinien-Optionen berücksichtigt und Alternativen abgelehnt, wenn die formatierten Teilstrich-Labels dupliziert werden oder sich überschneiden. Sie können also format:"#" angeben, wenn Sie nur Ganzzahlwerte anzeigen möchten. Wenn keine Alternative diese Bedingung erfüllt, werden keine Gitternetzlinien oder Teilstriche angezeigt.

Ein Objekt mit Mitgliedern zum Konfigurieren der Gitternetzlinien auf der vertikalen Achse. Beachten Sie, dass die Gitternetzlinien für die vertikale Achse horizontal gezeichnet sind. Zur Angabe von Attributen dieses Objekts können Sie die Objektliteralschreibweise verwenden, wie hier gezeigt:

{color: '#333', minSpacing: 20}

Die Farbe der vertikalen Gitternetzlinien im Diagrammbereich. Geben Sie einen gültigen HTML-Farbstring an.

Die ungefähre Anzahl horizontaler Gitternetzlinien im Diagrammbereich. Wenn Sie für gridlines.count eine positive Zahl angeben, wird damit die minSpacing zwischen den Gitternetzlinien berechnet. Sie können den Wert 1 angeben, wenn nur eine Gitternetzlinie gezeichnet werden soll, oder 0, um keine Gitternetzlinien zu zeichnen. Geben Sie den Standardwert „-1“ an, um die Anzahl der Gitternetzlinien auf der Grundlage anderer Optionen automatisch zu berechnen.

Ein Array von Größen (als Datenwerte, nicht Pixel) zwischen benachbarten Gitternetzlinien. Diese Option ist derzeit nur für numerische Achsen verfügbar, entspricht jedoch den Optionen gridlines.units.<unit>.interval, die nur für Datum und Uhrzeit verwendet werden. Bei linearen Skalen ist der Standardwert [1, 2, 2.5, 5].Das bedeutet, dass die Gitternetzlinienwerte auf jede Einheit (1), auf geraden Einheiten (2) oder auf ein Vielfaches von 2,5 oder 5 fallen können. Potenz von 10-fachem Wert wird ebenfalls berücksichtigt (z.B. [10, 20, 25, 50] und [.1, .2, .25, .5]). Für Logskalierungen ist der Standardwert [1, 2, 5].

Der minimale Bildschirmabstand in Pixeln zwischen den Hauptgitternetzlinien in hAxis. Der Standardwert für große Gitternetzlinien ist 40 für lineare Skalen und 20 für Logskalierungen. Wenn Sie die count und nicht die minSpacing angeben, wird der minSpacing aus der Anzahl berechnet. Wenn Sie umgekehrt minSpacing und nicht count angeben, wird die Anzahl anhand der minSpacing berechnet. Wenn Sie beides angeben, überschreibt minSpacing den Wert.

Alle Gitternetz- und Teilstrichwerte müssen ein Vielfaches des Werts dieser Option sein. Beachten Sie, dass im Gegensatz zu Intervallen das Zehnfache des Vielfachen nicht berücksichtigt wird. Sie können z. B. erzwingen, dass Ticks als Ganzzahlen angegeben werden, oder erzwingen, dass Ticks ein Vielfaches von 1.000 sind, wenn Sie gridlines.multiple = 1000 angeben.

Überschreibt das Standardformat für verschiedene Aspekte von Datentypen für Datum/Datum/Uhrzeit, wenn es mit berechneten Gitternetzlinien verwendet wird. Ermöglicht die Formatierung für Jahre, Monate, Tage, Stunden, Minuten, Sekunden und Millisekunden.

Allgemeines Format:

gridlines: {
  units: {
    years: {format: [/*format strings here*/]},
    months: {format: [/*format strings here*/]},
    days: {format: [/*format strings here*/]},
    hours: {format: [/*format strings here*/]},
    minutes: {format: [/*format strings here*/]},
    seconds: {format: [/*format strings here*/]},
    milliseconds: {format: [/*format strings here*/]}
  }
}
    

Weitere Informationen finden Sie unter Datum und Uhrzeit.

Ein Objekt mit Mitgliedern zur Konfiguration der kleinen Gitternetzlinien auf der vertikalen Achse, ähnlich wie bei der Option vAxis.gridlines.

Die Farbe der vertikalen Nebengitternetzlinien im Diagrammbereich. Gib einen gültigen HTML-Farbstring an.

Die Option MinderjährigerGridlines.count ist größtenteils veraltet, mit der Ausnahme, dass Gitternetzlinien deaktiviert werden, indem die Anzahl auf 0 gesetzt wird. Die Anzahl der Nebengitternetzlinien hängt vom Intervall zwischen den Hauptgitternetzlinien (siehe vAxis.gridlines.interval) und dem erforderlichen Mindestbereich ab (siehe vAxis.minorGridlines.minSpacing).

Die Option „Nebengrills.interval“ entspricht der Intervalloption für die Hauptgitternetzlinien. Das ausgewählte Intervall ist jedoch immer ein gleichmäßiger Teiler des Hauptgitternetzintervalls. Das Standardintervall für lineare Skalen ist [1, 1.5, 2, 2.5, 5] und für Logskalierungen [1, 2, 5].

Der erforderliche Mindestabstand in Pixeln zwischen benachbarten kleinen Gitternetzlinien und zwischen kleinen und großen Gitternetzlinien. Der Standardwert ist 1/2 des minSpacing der Hauptgitterlinien für lineare Skalen und 1/5 des minSpacing für Logskalierungen.

Wie bei der gridlines.multiple.

Überschreibt das Standardformat für verschiedene Aspekte von Datentypen für Datum/Datum/Uhrzeit, wenn es mit im Diagramm berechneten Minderjährigen verwendet wird. Ermöglicht die Formatierung für Jahre, Monate, Tage, Stunden, Minuten, Sekunden und Millisekunden.

Allgemeines Format:

gridlines: {
  units: {
    years: {format: [/*format strings here*/]},
    months: {format: [/*format strings here*/]},
    days: {format: [/*format strings here*/]}
    hours: {format: [/*format strings here*/]}
    minutes: {format: [/*format strings here*/]}
    seconds: {format: [/*format strings here*/]},
    milliseconds: {format: [/*format strings here*/]},
  }
}
    

Weitere Informationen finden Sie unter Datum und Uhrzeit.

Bei „true“ wird die vertikale Achse zu einer logarithmischen Skala. Hinweis: Alle Werte müssen positiv sein.

vAxis-Eigenschaft, die die vertikale Achse zur logarithmischen Skala macht. folgende Arten von Werten sind möglich:

• null: Es wird keine logarithmische Skalierung durchgeführt.
• „log“ – Logarithmische Skalierung. Negative und Nullwerte werden nicht dargestellt. Diese Option entspricht der Einstellung vAxis: { logscale: true }.
• „mirrorLog“ – Logarithmische Skalierung, in der negative und Nullwerte dargestellt werden. Der dargestellte Wert einer negativen Zahl ist das negative Ergebnis des Logwerts des absoluten Werts. Werte nahe 0 werden auf einer linearen Skala dargestellt.

Diese Option wird nur für eine continuous-Achse unterstützt.

Position des Textes auf der vertikalen Achse relativ zum Diagrammbereich. Unterstützte Werte: „out“, „in“ und „none“.

Ein Objekt, das den Textstil der vertikalen Achse angibt. Das Objekt hat folgendes Format:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color kann ein beliebiger HTML-Farbstring sein, z. B. 'red' oder '#00cc00'. Siehe auch fontName und fontSize.

Ersetzt die automatisch generierten Y-Achsen-Ticks durch das angegebene Array. Jedes Element des Arrays muss entweder ein gültiger Tickwert (z. B. eine Zahl, ein Datum, ein Datum oder eine Uhrzeit) oder ein Objekt sein. Wenn es sich um ein Objekt handelt, sollte es die Eigenschaft v für den Tickwert und eine optionale f-Eigenschaft mit dem Literalstring haben, der als Label angezeigt werden soll.

Das viewWindow wird automatisch um die Mindest- und Höchstwerte erweitert, es sei denn, Sie geben viewWindow.min oder viewWindow.max zum Überschreiben an.

Beispiele:

• vAxis: { ticks: [5,10,15,20] }
• vAxis: { ticks: [{v:32, f:'thirty two'}, {v:64, f:'sixty four'}] }
• vAxis: { ticks: [new Date(2014,3,15), new Date(2013,5,15)] }
• vAxis: { ticks: [16, {v:32, f:'thirty two'}, {v:64, f:'sixty four'}, 128] }

vAxis-Attribut, das einen Titel für die vertikale Achse angibt.

Ein Objekt, das den Titeltext der vertikalen Achse angibt. Das Objekt hat folgendes Format:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color kann ein beliebiger HTML-Farbstring sein, z. B. 'red' oder '#00cc00'. Siehe auch fontName und fontSize.

Verschiebt den Maximalwert der vertikalen Achse auf den angegebenen Wert. Dies wird bei den meisten Diagrammen nach oben angewendet. Wird ignoriert, wenn dieser Wert kleiner als der maximale y-Wert der Daten ist. vAxis.viewWindow.max überschreibt diese Property.

Verschiebt den Mindestwert der vertikalen Achse auf den angegebenen Wert. Dieser Wert wird in den meisten Diagrammen nach unten verschoben. Wird ignoriert, wenn dieser Wert größer als der minimale y-Wert der Daten ist. vAxis.viewWindow.min überschreibt diese Property.

Gibt an, wie die vertikale Achse skaliert wird, um die Werte im Diagrammbereich zu rendern. Die folgenden Stringwerte werden unterstützt:

• „pretty“: Die vertikalen Werte werden so skaliert, dass die maximalen und minimalen Datenwerte im unteren und oberen Bereich des Diagrammbereichs ein wenig gerendert werden. Das viewWindow wird auf die nächste Hauptrasterlinie für Zahlen oder die nächste Nebengitterlinie für Datumsangaben und Uhrzeiten erweitert.
• „maximized“ (maximiert): Die vertikalen Werte werden so skaliert, dass die Maximal- und Minimalwerte den oberen und unteren Teil des Diagrammbereichs berühren. Dadurch werden vaxis.viewWindow.min und vaxis.viewWindow.max ignoriert.
• „explizit“: Diese Option zur Angabe der oberen und unteren Skalierungswerte des Diagrammbereichs wurde eingestellt. (Veraltet, da es mit vaxis.viewWindow.min und vaxis.viewWindow.max redundant ist. Datenwerte außerhalb dieser Werte werden zugeschnitten. Du musst ein vAxis.viewWindow-Objekt angeben, das die Höchst- und Mindestwerte für die Anzeige angibt.

Gibt den Zuschneidebereich der vertikalen Achse an.

Der maximale vertikale Datenwert, der gerendert werden soll.

Wird ignoriert, wenn vAxis.viewWindowMode „pretty“ oder „maximiert“ ist.

Der minimale vertikale Datenwert, der gerendert werden soll.

Wird ignoriert, wenn vAxis.viewWindowMode „pretty“ oder „maximiert“ ist.

Breite des Diagramms in Pixeln.

Zeichnet das Diagramm. Im Diagramm sind weitere Methodenaufrufe erst möglich, nachdem das Ereignis ready ausgelöst wurde. Extended description

Gibt das Kurzinfo-Aktionsobjekt mit dem angeforderten actionID zurück.

Gibt ein Objekt zurück, das links, oben, breit und hoch des Diagrammelements id ist. Das Format für id ist noch nicht dokumentiert. Es sind die Rückgabewerte von Ereignis-Handlern. Hier einige Beispiele:

var cli = chart.getChartLayoutInterface();

Höhe des Diagrammbereichs

cli.getBoundingBox('chartarea').height

Breite des dritten Balkens in der ersten Reihe eines Balken- oder Säulendiagramms

cli.getBoundingBox('bar#0#2').width

Begrenzungsrahmen im fünften Keil eines Kreisdiagramms

cli.getBoundingBox('slice#4')

Begrenzungsrahmen der Diagrammdaten eines vertikalen Diagramms (z.B. eines Spaltendiagramms):

cli.getBoundingBox('vAxis#0#gridline')

Begrenzungsrahmen der Diagrammdaten eines horizontalen Diagramms (z.B. Balkendiagramms):

cli.getBoundingBox('hAxis#0#gridline')

Die Werte beziehen sich auf den Container des Diagramms. Rufen Sie diese Methode auf, nachdem das Diagramm gezeichnet wurde.

Gibt ein Objekt zurück, das links, oben, breit und hoch des Diagramminhalts ist, d.h. ohne Labels und Legende:

var cli = chart.getChartLayoutInterface();

cli.getChartAreaBoundingBox().left

cli.getChartAreaBoundingBox().top

cli.getChartAreaBoundingBox().height

cli.getChartAreaBoundingBox().width

Die Werte beziehen sich auf den Container des Diagramms. Rufen Sie diese Methode auf, nachdem das Diagramm gezeichnet wurde.

Gibt ein Objekt zurück, das Informationen zur Platzierung des Diagramms und seiner Elemente auf dem Bildschirm enthält.

Die folgenden Methoden können für das zurückgegebene Objekt aufgerufen werden:

• getBoundingBox
• getChartAreaBoundingBox
• getHAxisValue
• getVAxisValue
• getXLocation
• getYLocation

Rufen Sie diese Methode auf, nachdem das Diagramm gezeichnet wurde.

Gibt den horizontalen Datenwert bei xPosition zurück. Dies ist ein Pixelversatz vom linken Rand des Diagrammcontainers. Kann negativ sein.

Beispiel: chart.getChartLayoutInterface().getHAxisValue(400).

Rufen Sie diese Methode auf, nachdem das Diagramm gezeichnet wurde.

Gibt das serialisierte Diagramm als Bild-URI zurück.

Rufen Sie diese Methode auf, nachdem das Diagramm gezeichnet wurde.

Weitere Informationen finden Sie unter PNG-Diagramme drucken.

Gibt ein Array der ausgewählten Diagrammentitäten zurück. Auswählbare Elemente sind Balken, Einträge in Legenden und Kategorien. Ein Balken entspricht einer Zelle in der Datentabelle, einem Legendeneintrag für eine Spalte (Zeilenindex ist null) und einer Kategorie für eine Zeile (Spaltenindex ist null). Für dieses Diagramm kann jeweils nur eine Entität ausgewählt werden. Extended description.

Gibt den vertikalen Datenwert bei yPosition zurück. Dies ist ein Pixelversatz vom oberen Rand des Diagrammcontainers. Kann negativ sein.

Beispiel: chart.getChartLayoutInterface().getVAxisValue(300).

Rufen Sie diese Methode auf, nachdem das Diagramm gezeichnet wurde.

Gibt die Pixel-x-Koordinate von dataValue relativ zum linken Rand des Containers des Diagramms zurück.

Beispiel: chart.getChartLayoutInterface().getXLocation(400).

Rufen Sie diese Methode auf, nachdem das Diagramm gezeichnet wurde.

Gibt die Pixel-y-Koordinate von dataValue relativ zum oberen Rand des Containers des Diagramms zurück.

Beispiel: chart.getChartLayoutInterface().getYLocation(300).

Rufen Sie diese Methode auf, nachdem das Diagramm gezeichnet wurde.

Entfernt die Kurzinfo-Aktion mit dem angeforderten actionID aus dem Diagramm.

Legt eine Kurzinfo-Aktion fest, die ausgeführt werden soll, wenn der Nutzer auf den Aktionstext klickt.

Für die Methode setAction wird ein Objekt als Aktionsparameter verwendet. Für dieses Objekt sollten drei Eigenschaften angegeben werden: id – die festgelegte ID, text – der Text, der in der Kurzinfo der Aktion angezeigt wird, und action – die Funktion, die ausgeführt werden soll, wenn ein Nutzer auf den Aktionstext klickt.

Alle Kurzinfo-Aktionen sollten vor dem Aufruf der draw()-Methode des Diagramms festgelegt werden. Erweiterte Beschreibung.

Die angegebenen Diagrammentitäten werden ausgewählt. Die vorherige Auswahl wird abgebrochen. Auswählbare Elemente sind Balken, Einträge in Legenden und Kategorien. Ein Balken entspricht einer Zelle in der Datentabelle, einem Legendeneintrag für eine Spalte (Zeilenindex ist null) und einer Kategorie für eine Zeile (Spaltenindex ist null). Für dieses Diagramm kann jeweils nur eine Entität ausgewählt werden. Extended description.

Löscht das Diagramm und gibt alle zugehörigen Ressourcen frei.

Wird ausgelöst, wenn die Umstellungsanimation beendet ist.

Wird ausgelöst, wenn der Nutzer in das Diagramm klickt Kann verwendet werden, um zu erkennen, wann auf den Titel, Datenelemente, Legendeneinträge, Achsen, Gitternetzlinien oder Labels geklickt wird.

Wird ausgelöst, wenn beim Rendern des Diagramms ein Fehler auftritt

Wird ausgelöst, wenn der Nutzer auf Paginierungspfeile klickt Gibt den aktuellen nullbasierten Seitenindex und die Gesamtzahl der Seiten zurück.

Wird ausgelöst, wenn der Nutzer den Mauszeiger auf eine visuelle Entität bewegt Gibt die Zeilen- und Spaltenindexe des entsprechenden Datentabellenelements zurück.

Wird ausgelöst, wenn der Nutzer die Maus von einer visuellen Entität wegbewegt Gibt die Zeilen- und Spaltenindexe des entsprechenden Datentabellenelements zurück.

Das Diagramm ist bereit für externe Methodenaufrufe. Wenn Sie mit dem Diagramm interagieren und Methoden nach dem Zeichnen aufrufen möchten, sollten Sie einen Listener für dieses Ereignis einrichten, bevor Sie die Methode draw aufrufen. Sie sollten sie erst aufrufen, nachdem das Ereignis ausgelöst wurde.

Wird ausgelöst, wenn der Nutzer auf ein visuelles Element klickt. Rufen Sie getSelection() auf, um zu erfahren, was ausgewählt wurde.