Es gibt Funktionen, mit denen jede einzelne Eigenschaft eingestellt werden kann und Funktionen, mit denen ein ganzes Bündel von Eigenschaften eingestellt werden kann. Auf dieser Seite werden die Funktionen zum Setzen einzelner Eigenschaften aufgelistet.
Die Eigenschaften müssen vor dem Aufruf von Zeichen-Funktionen eingestellt werden. Sie werden allen neuen Grafikelementen zugewiesen. Die Eigenschaften müssen also nicht vor jedem Aufruf einer Grafik-Funktion erneut gesetzt werden, sofern sie nicht geändert werden sollen. Das Setzen von Eigenschaften hat keinen Einfluss auf bereits gezeichnete Elemente.
SetColor() | Setzt die Farbe für Linien, Marker, Gitter und Achsen |
SetBgColor() | Setzt die Füllfarbe von Flächen |
SetLineWidth() | Setzt die Strichdicke von Linien |
SetTextClass() | Setzt eine CSS Klasse für Texte fest |
SetTextFont() | Setzt die Schriftart von Texten |
SetTextSize() | Setzt die Schriftgrösse |
SetTextRotation() | Rotiert einen Canvas-Text |
SetTextColor() | Setzt die Farbe für Texte |
SetLineHeight() | Setzt den Zeilenabstand |
SetFontStyle() | Setzt den Text-Stil (normal, italix) |
SetFontWeight() | Setzt die Text-Dicke (normal, bold) |
SetFontAttr() | Setzt die Text Stil und Dicke (italic, bold) |
SetTextAlign() | Setzt die Text-Ausrichtung (Horizontal und Vertikal) |
SetTextAlignS() | Setzt die Text-Ausrichtung (Horizontal und Vertikal) wie angegeben in einem String |
SetTextHAlign() | Setzt die horizontale Text-Ausrichtung |
SetTextVAlign() | Setzt die vertikale Text-Ausrichtung |
SetTextPadding() | Setzt das Text-Padding |
SetMarkerSymbol() | Wählt ein Marker-Symbol aus |
SetMarkerSize() | Setzt die Marker-Grösse |
JsGraph.SetColor( Color )
Mit SetColor wird die Farbe für Linien (Polygon, Rechteck, Kreis, Ellipse), Marker, Gitternetz, Achsen, Tics und Rahmen eingestellt. Die Farbe für Texte kann mit SetTextColor() eingestellt werden.
Die aktuell eingestellte Farbe kann aus dem Property Color ausgelesen werden. Die Farbe kann auch mit einer der Funktionen SetLineAttr(), SetMarkerAttr() oder SetAreaAttr() gesetzt werden.
JsGraph.SetBgColor( BgColor )
SetBgColor setzt die Füllfarbe für Grafikelemente, welche gefüllt werden können (Polygon, Rechteck, Kreis, Ellipse, einige Marker). Ob ein Element gefüllt wird oder nicht kann bei der entsprechenden Zeichenfunktion im Mode-Parameter angegeben werden.
Viele Grafikelemente wie Rechteck, Kreis, Ellipse, Polygon und einige Marker können auf drei Arten gezeichnet werden: Nur als Linien, nur als Flächen oder beides (siehe jeweilige Zeichen-Funktion). BgColor definiert die Füllfarbe für alle diese Elemente.
Die aktuell eingestellten Füllfarbe kann aus dem Property BgColor ausgelesen werden. Wenn ein Farbverlauf aktiv ist, verweist das Property BgGradient auf diesen. Wenn kein Farbverlauf aktiv ist, ist BgGradient = null und es wird mit der Farbe BgColor gefüllt.
Die Füllfarbe kann auch mit einer der Funktionen SetAreaAttr() oder SetMarkerAttr() gesetzt werden.
JsGraph.SetLineWidth( LineWidth )
Mit SetLineWidth wird die Strichdicke von Linien (Polygon, Rechteck, Kreis, Ellipse), Marker, Gitternetz, Achsen, Tics und Rahmen eingestellt. Für ein Beispiel, wie verschiedene Strichdicken aussehen, siehe JSG Test: LineWidth.
Die aktuell eingestellte Strichdicke kann aus dem Property LineWidth ausgelesen werden. Es können dank Anti-Aliasing auch Strichdicken mit Bruchteilen von Pixel-Breiten (z.B. 1.5 Pixel) gezeichnet werden. Eine Strichdicke von 0 zeichnet eine Linie mit genau 1 Pixel Breite, egal welche Skalierung der Viewport oder der Browser hat. Dieser Wert ist sinnvoll als Rahmenbreite für Flächen, wenn mehrere Flächen ohne Zwischenraum genau aneinander gefügt werden sollen.
Hinweis: Das Attribut LineWidth gilt nicht nur für Linien (Polygon, Rechteck, Kreis, Ellipse), sondern auch für Marker, Gitternetz, Achsen, Tics und Rahmen. Die Strichdicke kann auch mit einer der Funktionen SetLineAttr(), SetMarkerAttr() oder SetAreaAttr() gesetzt werden.
JsGraph.SetTextClass( Class, ClearAttr )
Mit SetTextClass kann Texten eine CSS-Klasse zugewiesen werden, welche das Aussehen des Textes beeinflusst. Einzelne Styles der Klasse können durch die Einzel-Attribut Funktionen überschrieben werden. Um alle Einzel-Attribute zu löschen, kann die Funktion ClearTextAttr() gerufen werden. Undefinierte Styles werden von übergeordneten Elementen geerbt.
Wenn Class = '' gesetzt wird (Standardwert), erhalten die nachfolgend erzeugten Texte keine Klasse zugewiesen.
Die aktuelle Text-Klasse kann im Property TextClass abgerufen werden.
JsGraph.SetTextFont( Font )
Mit SetTextFont kann die Schriftart gewählt werden. Es können mehrere Schriftarten durch Komma voneinander getrennt angegeben werden. Es wird von links beginnend auf dem System nach der ersten vorhandenen Schriftart gesucht. Ist keine der gewünschten Schriftarten im System vorhanden, wird eine automatisch eine möglichst ähnliche vorhandene Schriftart verwendet.
Wennn Font = '' gesetzt wird, kann die Schriftart mit TextClass festgelegt werden oder sie wird von übergeordneten Elementen geerbt.
jsg.SetTextFont( 'Courier New,Courier,monospace' );
Der Aktuell gesetzte Font kann im Property TextFont abgerufen werden. Der Textfont kann auch mit der Funktion SetTextAttr() gesetzt werden.
JsGraph.SetTextSize( Size )
Mit SetTextSize kann die Schriftgrösse in Pixel festgelegt werden. Wenn Size = 0 gesetzt wird, kann bei TextRendering = 'canvas' die Textgrösse in der Klasse TextClass definiert werden oder der Text erbt die Grösse von übergeordneten Elementen.
Die aktuell eingestellte Textgrösse kann im Property TextSize ausgelesen werden. Size wird intern mit ScalePix() skaliert, wenn AutoScalePix true ist. Der Wert von TextSize entspricht jedoch immer dem mit SetTextSize() eingestellten Wert.
Die Textgrösse kann auch mit der Funktion SetTextAttr() gesetzt werden.
JsGraph.SetTextRotation( Rot )
Rotation des Textes in Grad oder Radian (siehe SetAngleMeasure(). Positive Werte rotieren immer im Uhrzeigersinn, unabhängig von der aktuelle gewählten Transformation (siehe SelectTrans()).
Solange keine Objekt-Transformation definiert ist, rotiert der Text immer unverzerrt, selbst wenn im Bild für die X- und Y-Achsen verschiedene Skalierungen definiert sind.
Die Text Rotation wird im Peroperty TextRotation gespeichert.
Ein den Text umschliessendes Rechteck kann mit der Funktion TextBox() gezeichnet werden.
Hinweis: Es können nur Texte rotiert werden, welche im TextRendering = 'canvas' gezeichnet werden.
JsGraph.SetTextColor( Color )
Mit SetTextColor wird die Farbe für Text eingestellt. Wenn Color = '' gesetzt wird, kann die Textfarbe mit TextClass eingestellt werden oder sie wird von übergeordneten Elementen geerbt.
Die aktuell eingestellte Farbe kann aus dem Property TextColor ausgelesen werden. Die Farbe kann auch mit der Funktion SetTextAttr() gesetzt werden.
JsGraph.SetLineHeight( Height )
Mit SetLineHeight kann die Zeilenhöhe und damit der Zeilenabstand von mehrzeiligem Text festgelegt werden. Wenn Height = 0 ist, wird eine Zeilenhöhe von 100% eingestellt. Wenn Height = -1 ist, kann die Zeilenhöhe mit TextClass eingestellt werden oder wird von übergeordneten Elementen übernommen.
Der aktuell eingestellte Zeilenabstand kann im Property LineHeight ausgelesen werden. Height wird intern mit ScalePix() skaliert, wenn AutoScalePix true ist. Der Wert von LineHeight entspricht jedoch immer dem mit SetLineHeight() eingestellten Wert.
JsGraph.SetFontStyle( Style )
Mit SetFontStyle kann der Schriftstil 'normal' oder 'italic' (Schrägschrift) festgelegt werden. Wenn Style = '' gesetzt wird, kann der Schriftstil (fontStyle-Property) mit TextClass festgelegt werden oder es wird die Einstellung des übergeordneten Elementes geerbt.
Der aktuell eingestellte Stil kann im Property FontStyle ausgelesen werden. Der Schriftstil kann auch mit der Funktion SetTextAttr() gesetzt werden. Die Schriftdicke (Fett) kann mit der Funktion SetFontWeight() gesetzt werden.
JsGraph.SetFontWeight( Weight )
Mit SetFontWeight kann die Schriftdicke 'normal' oder 'bold' (Fettschrift) festgelegt werden. Wenn Weight = '' gesetzt wird, kann die Schriftdicke (fontWeight-Property) mit TextClass festgelegt werden oder es wird die Einstellunug des übergeordneten Elementes geerbt.
Die aktuell eingestellte Schriftdicke kann im Property FontWeight ausgelesen werden. Die Schriftdicke kann auch mit der Funktion SetTextAttr() gesetzt werden. Der Schriftstil (Schrägschrift) kann mit der Funktion SetFontStyle() gesetzt werden.
JsGraph.SetFontAttr( Attr )
Mit SetFontAttr kann die Schriftdicke 'normal' oder 'bold' (Fettschrift) und der Schiftstyle 'normal' oder 'italic' in einem String festgelegt werden. Wenn im String Attr der Buchtatbe i enthalten ist, wird style = 'italic' festgelegt, sonst 'normal'. Wenn im String Attr der Buchtatbe b enthalten ist, wird weight = 'bold' festgelegt, sonst 'normal'. Die beiden Attribute können auch kombiniert werden.
JsGraph.SetTextAlign( HAlign, VAlign )
Mit SetTextAlign kann die Ausrichtung des Textes bezüglich des Text-Referenzpunktes festgelegt werden. Der Text-Referenzpunkt ist der Punkt, der beim Zeichnen des Textes der Zeichenfunktion übergeben wird, um die Position des Textes festzulegen. Diese Funktion ist eine Kombination der Funktionen SetTextHAlign() und SetTextVAlign().
Die aktuell eingestellten Ausrichtungen können in den Properties TextHAlign und TextVAlign ausgelesen werden. Die Ausrichtung kann auch mit den Funktionen SetTextAttr(), SetTextHAlign() und SetTextVAlign() gesetzt werden.
JsGraph.SetTextAlign( Align )
Mit SetTextAlignS kann die Ausrichtung des Textes bezüglich des Text-Referenzpunktes festgelegt werden. Der Text-Referenzpunkt ist der Punkt, der beim Zeichnen des Textes der Zeichenfunktion übergeben wird, um die Position des Textes festzulegen. Diese Funktion ist eine Kombination der Funktionen SetTextHAlign() und SetTextVAlign().
Die aktuell eingestellten Ausrichtungen können in den Properties TextHAlign und TextVAlign ausgelesen werden. Die Ausrichtung kann auch mit den Funktionen SetTextAttr(), SetTextHAlign() und SetTextVAlign() gesetzt werden. Vergleiche auch mit SetTextAlign() für mehr Informationen.
Dies ist eine simplere Version der Funktion SetTextAlign(), da hier mehrere Attribute in einem String festgelegt werden können: Attr = 'NSWEC'
Die Ausrichtungen NS und WE können kombiniert werden. So ist zum Beisiel 'NW' = 'top left'. Wird keine Ausrichtung angegeben, so wird 'C' = 'center middle' eingestellt. Achtung, die Funktion setzt style, weigth und alignment auf jeden fall, selbst wenn nichts angegeben wird.
JsGraph.SetTextHAlign( HAlign )
Mit SetTextHAlign kann die horizontale Ausrichtung des Textes bezüglich des Text-Referenzpunktes festgelegt werden. Der Text-Referenzpunkt ist der Punkt, der beim Zeichnen des Textes der Zeichenfunktion übergeben wird, um die Position des Textes festzulegen.
Die aktuell eingestellte Ausrichtung kann im Property TextHAlign ausgelesen werden. Die horizontale Ausrichtung kann auch mit den Funktionen SetTextAttr() und SetTextAlign() gesetzt werden.
JsGraph.SetTextVAlign( VAlign )
Mit SetTextVAlign kann die vertikale Ausrichtung des Textes bezüglich des Text-Referenzpunktes festgelegt werden. Der Text-Referenzpunkt ist der Punkt, der beim Zeichnen des Textes der Zeichenfunktion übergeben wird, um die Position des Textes festzulegen.
Die aktuell eingestellte Ausrichtung kann im Property TextVAlign ausgelesen werden. Die vertikale Ausrichtung kann auch mit den Funktionen SetTextAttr() und SetTextHAlign() gesetzt werden.
JsGraph.SetTextPadding( HPadding, VPadding )
Zwischen Referenzpunkt und Text kann ein Abstand (Padding) mit dieser Funktion definiert werden. Das Padding wird wie die Textgrösse immer in Pixeln angegeben. Das Padding wirkt sich auch entsprechend auf die mit GetTextBox() erzeugte Textbox aus. GetTextSize() liefert hingegen immer nur die Grösse des Textes ohne Padding.
Das Text-Padding kann auch mit der Funktion SetTextAttr() festgelegt werden.
Die aktuell eingestellten Paddings können in den Properties TextHPad und TextVPad ausgelesen werden. Die Paddings werden intern mit ScalePix() skaliert, wenn AutoScalePix true ist. Die Werte der Properties entsprechen jedoch immer den mit SetTextPadding() eingestellten Werten.
JsGraph.SetMarkerSymbol( SymbolName )
Mit SetMarkerSymbol wird festgelegt, welcher Marker mit der Funktion Marker() gezeichnet werden soll.
Das aktuell eingestellte Marker-Symbol kann im Property MarkerSymbol ausgelesen werden. Das Marker-Symbol kann auch mit der Funktion SetMarkerAttr() gesetzt werden.
Weitere Informationen und eine Liste aller Marker-Symbole
JsGraph.SetMarkerSize( Size )
Mit SetMarkerSize kann die Grösse der Marker in Pixel festgelegt werden.
Die aktuell eingestellte Markergrösse kann im Property MarkerSize ausgelesen werden. Die Markergrösse kann auch mit der Funktion SetMarkerAttr() gesetzt werden.