Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Inhalt:

  • Definieren eines TextStyles: Konfigurieren
  • Definieren von BeschriftungenLegendOptions
  • LegendOptions: Konfigurieren der Legendevon BackgroundStyle
  • BackgroundStyle: Konfigurieren Hintergrundfarbe von Größe und RänderPosition

Anchor
TextStyles
TextStyles
Definieren eines TextStyles

...

Code Block
languagejava
themeEclipse
firstline1
linenumberstrue
//Erstellen einer Konfiguration für das Chart
XdevBarChartConfig config = new XdevBarChartConfig();

//Definieren eines Texstyles
final TextStyle textStyle = new TextStyle.Builder();
textStyle			.setFontNamefontName("Arial"); //Wahl der Schriftart (Schriftart muss vom Browser unterstützt werden) 
			.color("red") // Wahl der Schriftfarbe wahlweise in Kurzschreibweise ("Red") oder 
textStyle.setBold(true);Farbcodes ("#FFFFFF")
			.bold() //Fettdruck an- oder ausschalten
textStyle			.setItalicitalic(true); //Kusivdruck an- oder ausschalten
textStyle			.setFontSizefontSize(12); //Setzen der Schriftgröße
textStyle			.setColor("Red"); oder textStyle.setColor("#FFFFFF"); //Wahl der Schriftfarbe wahlweise in Kurzschreibweise ("Red") oder Farbcodes ("#FFFFFF")

build();

//Zuweisen der Konfiguration für Beschriftungen		
configthis.chart.setTitleTextStyle(textStyle);

...

Code Block
languagejava
themeEclipse
firstline1
linenumberstrue
//Erstellen einer Konfiguration für das Chart
XdevBarChartConfig config = new XdevBarChartConfig();

//Definieren eines Legendenstyles
final LegendOptionsLegend legendOptionslegend = new LegendOptionsLegend.Builder();
legendOptions			.setTextStyletextStyle(textStyle); //Setzen eines TextStyles (siehe oben)
legendOptions			.setPositionposition(XdevChartOptionsPosition.POSITION_BOTTOM); //Auswahl der Position für die Legende. Auswahlmöglichkeiten: .POSITION_BOTTOM, .POSITION_TOP, .POSITION_RIGHT, .POSITION_LEFT
legendOptions			.setMaxLinesmaxLines(5); //Befindet sich die Legende Über dem Chart (POSITION_TOP) kann hier entschieden werden bis auf wie viele Zeilen umgebrochen werden darf
legendOptions			.setAlignmentbuild(XdevChartOptions.ALIGNMENT_CENTER);
//Anordnung
der legende an der jeweiligen Position. Auswahlmöglichkeiten: .START, .CENTER, .END

//Zuweisen der Konfiguration für Beschriftungen
configthis.chart.setLegend(legendOptionslegend);

Anchor
BackgroundStyle
BackgroundStyle

...

Konfigurieren von BackgroundStyle

Über das Objekt "LegendOptionsBackgroundStyle" lassen sie die Legenden der einzelnen Chart beeinflussen und konfigurieren.

Code Block
languagejava
themeEclipse
firstline1
linenumberstrue
//Erstellen einer Konfiguration für das Chart
XdevBarChartConfig config = new XdevBarChartConfig();

//Definieren eines BackgrundStylesBackgroundStyles
final BackgroundStyleStrokeFill stylebackground = new BackgroundStyle();
style.setFill("white");  Background.StrokeFill("White", 40, "#FFFFFF");
Param1: stroke("White") 	//Wahl der Hintergrundfarben wahlweise in Kurzschreibweise ("Red") oder Farbcodes ("#FFFFFF")
style.setStroke("black"); Param2: strokeWidth(40)	 	//Randbreite in Pixel
Param3: fill("#FFFFFF") 	//Wahl der Farbe für den Rand des Charts wahlweise in Kurzschreibweise ("Red") oder Farbcodes ("#FFFFFF")
style.setStrokeWidth(10);
oder

//Randbreite in PixelDefinieren der Hintergrundfarbe
final Color background = Background.Color("green");

//Zuweisen der Konfiguration für Beschriftungen
configchart.setBackgroundColor(stylebackground);

...

Anchor
Position und Größe
Position und Größe
Konfigurieren von Größe und Position

Code Block
languagejava
themeEclipse
firstline1
linenumberstrue
//Erstellen einer Konfiguration für das Chart
XdevBarChartConfig config = new XdevBarChartConfig();

//Definieren eines Backgroundstyles
final BackgroundStyle style = new BackgroundStyle();
style.setFill("white");
style.setStroke("black");
style.setStrokeWidth(10);

final ChartArea chartArea = ChartArea.New("100", "100", "500", "500"); // Parameter für Abstand links, rechts und Höhe, Breite des Charts

this.chart.setChartArea(chartArea);

Beispiel:

Code Block
languagejava
themeEclipse
firstline1
linenumberstrue
//Definieren der Hintergrundfarbe
final Color background = Background.Color("green");

//Definieren eines Texstyles
final TextStyle textStyle = new TextStyle.Builder();
textStyle			.setBoldfontName(true"Arial");
textStyle			.setFontNamecolor("Arialred");
textStyle			.setFontSizebold(12);
textStyle			.setItalicitalic(true);
textStyle			.setColorfontSize("Red"12); oder textStyle.setColor("#FFFFFF"
			.build();

//Definieren eines Legendenstyles
LegendOptionsfinal Legend legendOptionslegend = new LegendOptionsLegend.Builder();
legendOptions			.setTextStyletextStyle(textStyle);
legendOptions			.setPositionposition(XdevChartOptionsPosition.POSITION_BOTTOM);
legendOptions			.setMaxLinesmaxLines(5);
legendOptions			.setAlignmentbuild(XdevChartOptions.ALIGNMENT_CENTER);

//Zuweisen der Konfiguration für Beschriftungen
configthis.chart.setBackgroundColor(stylebackground);
configthis.chart.setTitleTextStylesetLegend(textStylelegend);
configthis.chart.setLegendsetTitleTextStyle(legendOptionstextStyle);