Versions Compared

Key

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

...

Inhalt:

  • Füllen von Daten

  • Properties

Allgemein

Detaillierte Information finden Sie zusätzlich hier: https://developers.google.com/chart/interactive/docs/gallery/sankey

Beispiel: Füllen der Daten

Code Block
languagejava
final ChartModel model = ChartModel.New()
	.addColumn(Column.New(Column.Type.STRING, "sourcecolumn"))
	.addColumn(Column.New(Column.Type.STRING, "destinationColumn"))
	.addColumn(Column.New(Column.Type.NUMBER, "valueColumn"));

model.addRow("Brazil", "Portugal", 5);
model.addRow("Brazil", "France", 1);
model.addRow("Brazil", "Spain", 1);
model.addRow("Brazil", "England", 1);
model.addRow("Canada", "Portugal", 1);
model.addRow("Canada", "France", 5);
model.addRow("Canada", "England", 1);
model.addRow("Mexico", "Portugal", 1);
model.addRow("Mexico", "France", 1);
model.addRow("Mexico", "Spain", 5);
model.addRow("Mexico", "England", 1);
model.addRow("USA", "Portugal", 1);
model.addRow("USA", "France", 1);
model.addRow("USA", "Spain", 1);
model.addRow("USA", "England", 5);
model.addRow("Portugal", "Angola", 2);
model.addRow("Portugal", "Senegal", 1);
model.addRow("Portugal", "Morocco", 1);
model.addRow("Portugal", "South Africa", 3);
model.addRow("France", "Angola", 1);
model.addRow("France", "Senegal", 3);
model.addRow("France", "Mali", 3);
model.addRow("France", "Morocco", 3);
model.addRow("France", "South Africa", 1);
model.addRow("Spain", "Senegal", 1);
model.addRow("Spain", "Morocco", 3);
model.addRow("Spain", "South Africa", 1);
model.addRow("England", "Angola", 1);
model.addRow("England", "Senegal", 1);
model.addRow("England", "Morocco", 2);
model.addRow("England", "South Africa", 7);
model.addRow("South Africa", "China", 5);
model.addRow("South Africa", "India", 1);
model.addRow("South Africa", "Japan", 3);
model.addRow("Angola", "China", 5);
model.addRow("Angola", "India", 1);
model.addRow("Angola", "Japan", 3);
model.addRow("Senegal", "China", 5);
model.addRow("Senegal", "India", 1);
model.addRow("Senegal", "Japan", 3);
model.addRow("Mali", "China", 5);
model.addRow("Mali", "India", 1);
model.addRow("Mali", "Japan", 3);
model.addRow("Morocco", "China", 5);
model.addRow("Morocco", "India", 1);
model.addRow("Morocco", "Japan", 3);

this.sankeyChart.setModel(model);

API und Methoden:

Properties

LinkColor Configuration

Code Block
languagejava
LinkColor.New(
      "black", // Color of the link border.
      3, // Thickness of the link border (default 0).
      "white", // Color of the link.
      0.4); // Transparency of the link.

Link Configuration

Controls attributes of the connections between nodes. Currently all attributes pertain to color:

Code Block
languagejava
// Custom color palette for sankey nodes. Nodes will cycle through this palette giving each node its own color.
final List<String> colors = Arrays.asList("#a6cee3", "#b2df8a", "#fb9a99", "#fdbf6f", "#cab2d6", "#ffff99", "#1f78b4", "#33a02c");
LinkColor linkColor = LinkColor.New("black", 3, "white", 0.4);

Link.New(
      linkColor, 
      colors, 
      ColorMode.GRADIENT); //Sets a coloring mode for the links between nodes.

Node Configuration

Controls attributes of the nodes (the vertical bars between links):

Code Block
final Node node = Node.Builder()
	.colors(colors)
	.interactivity(true) // Allows you to select nodes.
	.label(TextStyle.New("black", "Arial", 12))
	.labelPadding(5) // Horizontal distance between the label and the node.
	.nodePadding(5) // Vertical distance between nodes.
	.width(20) // Thickness of the node.
	.build();

Sankey Configuration

Code Block
languagejava
final Sankey sankey = Sankey.New(link, node);

sankeyChart.setSankey(sankey);