Important Notice - Forums is archived
To simplify things and help our users to be more productive, we have archived the current forum and focus our efforts on helping developers on Stack Overflow. You can post new questions on Stack Overflow or join our Discord channel.

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.
Vaadin Charts 2.1 scatter label issue
Vaadin charts 2.1 seems to now have a "feature" where it doesn't display some of the labels in scatter and bubble charts where they overlap with other labels.
Is there a way to turn this feature off and have all the labels displayed as in previous versions?
Thanks.
Iain
Hi Iain,
I did some tests resizing a chart with data labels and seems that overlapping label hiding was already done in previous versions.
It is possible that an upgrade in highcharts library caused the collision detection to be more strict.
Could you provide a simple example of chart configuration where labels are hidden with 2.1 and not with 2.0?
Hi Gillermo,
The following chart displays overlapping labels with 2.0 but not with 2.1. The Highcharts API implies that you can switch off the collision detection (maybe it was the default in previous versions to allow collisions), but this sin't exposed thru' Vaddin charts.
public static Chart drawTestBubble(){
double[] xval = { 40, 50, 55, 30,25,20};
double[] yval = { 80, 60, 62, 20, 24, 26};
double[] zval = { 5, 8, 7, 10,4,6};
String[] names = {"average bugs",
"fixed bugs",
"new features",
"features removed",
"some other text",
"a very long piece of text with no end in sight"};
Chart chart = new Chart(ChartType.BUBBLE);
Configuration conf = chart.getConfiguration();
conf.setTitle( "Test label overlap");
conf.getLegend().setEnabled(false); // Disable legend
conf.getyAxis().setTitle("Y axis title");
conf.getyAxis().setMin(0);
conf.getyAxis().setMax(100);
conf.getyAxis().setGridLineWidth(0);
conf.getxAxis().setTitle("X axis title");
conf.getxAxis().setMin(0);
conf.getxAxis().setMax(100);
conf.getxAxis().setGridLineWidth(0);
conf.disableCredits();
DataSeries series = new DataSeries();
for( int i = 0; i < 6; i++){
DataSeriesItem point = getBubbleItem(xval[i],yval[i], zval[i]);
point.setName(names[i]);
series.add(point);
}
PlotOptionsBubble options = new PlotOptionsBubble();
Labels labs = new Labels(true);
labs.setFormatter(
"this.point.name");
options.setDataLabels( labs);
series.setPlotOptions(options);
conf.addSeries(series);
chart.drawChart();
return chart;
}
public static DataSeriesItem getBubbleItem(Number number, Number number2, Number number3) {
DataSeriesItem3d dataSeriesItem = new DataSeriesItem3d();
dataSeriesItem.setX(number);
dataSeriesItem.setY(number2);
dataSeriesItem.setZ(number3);
return dataSeriesItem;
}
I am on vacation the next 2 weeks but would appreciate any help you can give.
BR
Iain
Hi Iain,
You are right, highcharts added an allowOverlap property to labels object in latest version (4.1.x), and there's no java API in vaadin charts to configure it yet.
As a workaround you can sublcass Labels class and add the property
public class LabelsWithOverlap extends Labels {
private Boolean allowOverlap;
public LabelsWithOverlap() {
super();
}
/**
* Creates a new enabled or disabled label
*
* @param enabled
* true to enable, false to disable
*/
public LabelsWithOverlap(boolean enabled) {
super(enabled);
}
public Boolean getAllowOverlap() {
return allowOverlap;
}
public void setAllowOverlap(Boolean allowOverlap) {
this.allowOverlap = allowOverlap;
}
}
I've just created a ticket reporting the missing API
https://dev.vaadin.com/ticket/18513
Vaadin Charts 2.1.2 was released fixing the related issue. Check it out from the directory