Inhalt:
- Daten- / Objektstruktur
- Füllen von Daten
- Chartkonfiguration
- Properties
Anchor | ||||
---|---|---|---|---|
|
Beschriftung | X-Axis | Y-Axis | Kategorie | BubbleGröße |
---|---|---|---|---|
"DEU" | 68.49 | 2.96 | "Europe" | 61801570 |
"GBR" | 79.66 | 1.67 | "Europe" | 81902307 |
"ISR" | 78.09 | 2.78 | "Middle East" | 31090763 |
... |
Optimale Objektstruktur (Java)
Code Block | ||||||||
---|---|---|---|---|---|---|---|---|
| ||||||||
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 | ||||
---|---|---|---|---|
|
Code Block | ||||||||
---|---|---|---|---|---|---|---|---|
| ||||||||
XdevBubbleChartModelfinal ChartModel model = new XdevBubbleChartModel("Life ChartModel.New()..addColumn(Column.New(Type.STRING, "bubbletext", "Bubbletext")) .addColumn(Column.New(Type.NUMBER, "x-value", "X-Axis")) .addColumn(Column.New(Type.NUMBER, "x-value", "Y-Axis")) .addColumn(Column.New(Type.STRING, "category", "Rate"Category")) .addColumn(Column.New(Type.NUMBER, "Countrybubblesize", "PeopleBubblesize")); model.addItemaddRow("CAN", 80.66, 1.67, "North America", 33739900d); model.addItemaddRow("GBR", 79.84, 1.36, "Europe", 81902307d); model.addItemaddRow("USA", 72.73, 1.84, "North America", 5523095d); model.addItemaddRow("IRN", 80.05, 4.77, "Middle East", 79716203d); model.addItemaddRow("DEU", 68.09, 2.96, "Europe", 61801570d); model.addItemaddRow("RUS", 81.55, 2.05, "Europe", 73137148d); model.addItemaddRow("ISR", 78.09, 2.78, "Middle East", 31090763d); |
API und Methoden:
Füllen der Daten
Code Block | ||||||||||
---|---|---|---|---|---|---|---|---|---|---|
| ||||||||||
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 |
...
Code Block | ||||||||
---|---|---|---|---|---|---|---|---|
| ||||||||
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); |
...
Code Block | ||||||||
---|---|---|---|---|---|---|---|---|
| ||||||||
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); |
...
Code Block | ||||||||
---|---|---|---|---|---|---|---|---|
| ||||||||
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 |
...
this.bubbleChart.setModel(model); |
Anchor | ||||
---|---|---|---|---|
|
API und Methoden:
Properties | |||||||
---|---|---|---|---|---|---|---|
SortBubblesBySize | The orientation of the chart. When set to
|
...
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
...
language | java |
---|---|
theme | Eclipse |
firstline | 1 |
linenumbers | true |
...
|