Versions Compared

Old Version 1

changes.mady.by.user Christian K

Saved on

compared with

New Version 2

changes.mady.by.user Christian K

Saved on

Key

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

Inhalt:


Anchor
Data
Data
Optimale Datenstruktur (Datenbank):

BeschriftungX-AxisY-AxisKategorieBubbleGröße
"DEU"68.492.96"Europe"61801570
"GBR"79.661.67"Europe"81902307
"ISR"78.092.78"Middle East"31090763
...



Optimale Objektstruktur (Java)

Code Block
languagejava
themeEclipse
firstline1
linenumberstrue
public class BubbleChartObject {
	private String description;
	private Double x_value;
	private Double y_value;
	private String category;
	private Double bubbleValue;

	public String getDescription() {
		return description;
	}

	public void setDescription(String description) {
		this.description = description;
	}

	public Double getX_value() {
		return x_value;
	}

	public void setX_value(Double x_value) {
		this.x_value = x_value;
	}

	public Double getY_value() {
		return y_value;
	}

	public void setY_value(Double y_value) {
		this.y_value = y_value;
	}

	public String getCategory() {
		return category;
	}

	public void setCategory(String category) {
		this.category = category;
	}

	public Double getBubbleValue() {
		return bubbleValue;
	}

	public void setBubbleValue(Double bubbleValue) {
		this.bubbleValue = bubbleValue;
	}
}

Anchor
Fill
Fill
Beispiel: Füllen der Daten

Code Block
languagejava
themeEclipse
firstline1
linenumberstrue
XdevBubbleChartModel model = new XdevBubbleChartModel("Life", "Rate", "Country", "People");

model.addItem("CAN", 80.66, 1.67, "North America", 33739900d);
model.addItem("GBR", 79.84, 1.36, "Europe", 81902307d);
model.addItem("USA", 72.73, 1.84, "North America", 5523095d);
model.addItem("IRN", 80.05, 4.77, "Middle East", 79716203d);
model.addItem("DEU", 68.09, 2.96, "Europe", 61801570d);
model.addItem("RUS", 81.55, 2.05, "Europe", 73137148d);
model.addItem("ISR", 78.09, 2.78, "Middle East", 31090763d);

API und Methoden:

Füllen der Daten

Code Block
languagejava
themeEclipse
firstline1
titlemodel.addItem(String value, String value2, Integer value3)
linenumberstrue
model.addItem("CAN", 80.66, 1.67, "North America", 33739900d);

//Parameter 1 ("CAN"): Beschreibung / Beschriftung der Bubbles
//Parameter 2 (80.66): Wert auf der X-Achse
//Parameter 3 (1.67): Wert auf der Y-Achse
//Parameter 4 ("North America"): Kategorie oder Gruppierung
//Parameter 5 (33739900d): Größe der Bubble

Anchor
Sizing
Sizing
Positionierung und Größe des Pie innerhalb des Chartbereichs

Code Block
languagejava
themeEclipse
firstline1
linenumberstrue
XdevBubbleChartConfig config = new XdevBubbleChartConfig();

final ChartArea area = new ChartArea();

area.setHeigth("100"); //Höhe des Pie
area.setWidth("100"); //Breite des Pie
area.setLeft("100"); //Abstand des Pie von Links in Pixel
area.setRight("100"); //Abstand des Pie von Links in Pixel
area.setTop("100"); //Abstand des Pie von Links in Pixel

config.setChartArea(area);

Anchor
Bubbles
Bubbles
Konfiguration der Bubbles

Code Block
languagejava
themeEclipse
firstline1
linenumberstrue
Bubble bubble = new Bubble();

bubble.setOpacity(0.5); //Setzen transparenz der Bubbles. Werte von 0 bis 1
bubble.setStroke("Black"); //Setzen Rahmenfarbe der Bubbles wahlweise in Kurzschreibweise ("Red") oder Farbcodes ("#FFFFFF")
bubble.setTextStyle(...); //Siehe API Allgemein "TextStyle"

config.setBubble(bubble);

Anchor
Colors
Colors
Konfiguration Farben 

Code Block
languagejava
themeEclipse
firstline1
linenumberstrue
XdevLineChartConfig config = new XdevLineChartConfig();

config.setBackgroundColor(...); //Siehe API Allgemein "BackgroundStyle"

//Eine Liste an Farben die dann der Reihe nach an die Kategorien vergeben werden
List<String> places = Arrays.asList("#FFFFFF", "Red", "#F4g6uz");
config.setColors(places); //Zuweisen der Farbliste

Anchor
Texts
Texts
Konfiguration Texte

Code Block
languagejava
themeEclipse
firstline1
linenumberstrue
XdevPieChartConfig config = new XdevPieChartConfig();

config.setLegend(...); //Siehe API Allgemein "LegendOptions"
config.setTitleTextStyle(...); //Siehe API Allgemein "TextStyle"
config.setFontName(""); //Wahl der Schriftart (Schriftart muss vom Browser unterstützt werden)
config.setFontSize(15); //Setzen allgemeine Schriftgröße im Chart
config.setTitle("Sales Overview"); //Setzen ChartTitel

Anchor
Tooltip
Tooltip
Konfiguration des Tooltips und wann er angezeigt werden soll

Code Block
languagejava
themeEclipse
firstline1
linenumberstrue
Tooltip tooltip = new Tooltip();

tooltip.setisHtml(true); //Tooltip per HTML Konfigurierbar Ja / Nein
tooltip.setTrigger("focus"); Mögliche Werte: "focus" --> MouseOver, "none" --> kein Tooltip, "selektion" --> MouseKlick

config.setTooltip(tooltip);