Inhalt:
- TextStyles: Konfigurieren von Beschriftungen
- LegendOptions: Konfigurieren der Legende
- BackgroundStyle: Konfigurieren Hintergrundfarbe und Ränder
- Größe / Position: Konfigurieren Größe und Position
Definieren eines TextStyles
Über das TextStyle Objekt lassen sich alle Texte des Chart beeinflussen und konfigurieren. Ein Chart kann unterschiedlichen Stellen unterschiedliche TextStyles besitzen.
//Definieren eines Texstyles final TextStyle textStyle = TextStyle.Builder() .fontName("Arial") //Wahl der Schriftart (Schriftart muss vom Browser unterstützt werden) .color("red") // Wahl der Schriftfarbe wahlweise in Kurzschreibweise ("Red") oder Farbcodes ("#FFFFFF") .bold() //Fettdruck an- oder ausschalten .italic() //Kusivdruck an- oder ausschalten .fontSize(12) //Setzen der Schriftgröße .build(); //Zuweisen der Konfiguration für Beschriftungen this.chart.setTitleTextStyle(textStyle);
Definieren von LegendOptions
Über das Objekt "LegendOptions" lassen sie die Legenden der einzelnen Chart beeinflussen und konfigurieren.
//Definieren eines Legendenstyles final Legend legend = Legend.Builder() .textStyle(textStyle) //Setzen eines TextStyles (siehe oben) .position(Position.BOTTOM) //Auswahl der Position für die Legende. Auswahlmöglichkeiten: .POSITION_BOTTOM, .POSITION_TOP, .POSITION_RIGHT, .POSITION_LEFT .maxLines(5) //Befindet sich die Legende Über dem Chart (POSITION_TOP) kann hier entschieden werden bis auf wie viele Zeilen umgebrochen werden darf .build(); //Zuweisen der Konfiguration für Beschriftungen this.chart.setLegend(legend);
Konfigurieren BackgroundStyle
Über das Objekt "BackgroundStyle" lassen sie die Legenden der einzelnen Chart beeinflussen und konfigurieren.
//Definieren eines BackgroundStyles final StrokeFill background = Background.StrokeFill("White", 40, "#FFFFFF"); Param1: stroke("White") //Wahl der Hintergrundfarben wahlweise in Kurzschreibweise ("Red") oder Farbcodes ("#FFFFFF") 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") oder //Definieren der Hintergrundfarbe final Color background = Background.Color("green"); //Zuweisen der Konfiguration für Beschriftungen chart.setBackgroundColor(background);
Konfigurieren Größe und Position
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:
//Definieren eines Backgroundstyles final BackgroundStyle style = new BackgroundStyle(); style.setFill("white"); style.setStroke("black"); style.setStrokeWidth(10); //Definieren eines Texstyles final TextStyle textStyle = new TextStyle(); textStyle.setBold(true); textStyle.setFontName("Arial"); textStyle.setFontSize(12); textStyle.setItalic(true); textStyle.setColor("Red"); oder textStyle.setColor("#FFFFFF"); //Definieren eines Legendenstyles LegendOptions legendOptions = new LegendOptions(); legendOptions.setTextStyle(textStyle); legendOptions.setPosition(XdevChartOptions.POSITION_BOTTOM); legendOptions.setMaxLines(5); legendOptions.setAlignment(XdevChartOptions.ALIGNMENT_CENTER); //Zuweisen der Konfiguration für Beschriftungen Chart.setBackgroundColor(style); Chart.setTitleTextStyle(textStyle); Chart.setLegend(legendOptions);