Directory

← Back

competition-chart

Visualization of a knockout chart

Author

Rating

Popularity

<100

An implementation of a knockout chart that can be used in two modes.

All running from left to right. Half from left half from right.

Sample code

KnockoutChart knockoutChart = new KnockoutChart();

...

final List<Competitor> group1 = new LinkedList<Competitor>();
// Competitor is built with (long id, String name, int tier)
// tier 0 means no matches won.
group1.add(new Competitor(1, getName(), 0));
group1.add(new Competitor(2, getName(), 0));

// (int groupNumber, String groupName, List<Competitor> participants)
knockoutChart.addGroup(1, "Group A", group1);

...

// also possible:
// (int groupNumber, String groupName, Competitor... participants)
knockoutChart.addGroup(2, "Group B", new Competitor(3, getName(), 0), new Competitor(4, getName(), 0));
private final Map<Integer, Competitor> participants = new HashMap<Integer, Competitor>();

public void init() {
	...

	knockoutChart.addListener(vcl);
	...
}

private final ValueSelectListener vcl = new ValueSelectListener() {
	private static final long serialVersionUID = 1835799531600547425L;

	public void valueSelect(final ValueSelectEvent event) {
		final Competitor c = participants.get(Integer.parseInt(Long.toString(event.getKey())));
		c.addAdvanced();
		knockoutChart.requestRepaint();
	}
};
// Selecting the chart layout (left and right or all from left)
knockoutChart.setChartMode(VisualisationMode.LEFT_RIGHT);
knockoutChart.requestRepaint();

// and
knockoutChart.setChartMode(VisualisationMode.LEFT_ONLY);
knockoutChart.requestRepaint();

// Setting if panning is enabled on mouse drag
knockoutChart.setPanningEnabled(pan.booleanValue());
knockoutChart.requestRepaint();

// Moving chart to original position after moving it around
knockoutChart.resetChartPositions();
knockoutChart.requestRepaint();

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

Vaadin 8 compatible version.

Released
2017-03-21
Maturity
BETA
License
Apache License 2.0

Compatibility

Framework
Vaadin 8.0+
Vaadin 7.0+ in 2.0.0
Vaadin 6.8+ in 1.2.0
Browser
Firefox
Opera
Safari
Google Chrome
Internet Explorer
Microsoft Edge

competition-chart - Vaadin Add-on Directory

Visualization of a knockout chart competition-chart - Vaadin Add-on Directory
An implementation of a knockout chart that can be used in two modes. All running from left to right. Half from left half from right.
Online Demo
Issue Tracker
Source Code
Forum

competition-chart version 1.2.0
Dropped absolute layout and HTML magic so now all functionalities use canvas.

competition-chart version 2.0.0
Vaadin 7 compatible version.

competition-chart version 3.0.0
Vaadin 8 compatible version.

Online