GANTT timescales seem to mess up when adding days with weeks

Flow
1

There seem to be a bug in the GANTT chart when trying to add a DAY timescale.

I can combine week and month, but day and week goes wrong.

Here is the important code :

private void configureYearsMonthsWeeksOnXAxis(Configuration configuration) {
	configureDaysAxis(configuration);
	configureWeeksAxis(configuration);
	// configureMonthsAxis(configuration);
}

private void configureDaysAxis(Configuration configuration) {
	XAxis axis = new XAxis();
	configuration.addxAxis(axis);
	axis.setMinPadding(0.05);
	axis.setMaxPadding(0.05);
	axis.setUnits(new TimeUnitMultiples(TimeUnit.DAY, 1));

	final Labels labels = new Labels();
	labels.setPadding(1);
	labels.setAlign(HorizontalAlign.CENTER);
	var style = new Style();
	style.setFontSize("16px");
	labels.setStyle(style);
	axis.setLabels(labels);

	axis.setGrid(new AxisGrid());
	axis.getGrid().setCellHeight(20);
}

private void configureWeeksAxis(Configuration configuration) {
	XAxis axis = new XAxis();
	configuration.addxAxis(axis);
	axis.setMinPadding(0.05);
	axis.setMaxPadding(0.05);
	axis.setUnits(new TimeUnitMultiples(TimeUnit.WEEK, 1));

	final Labels labels = new Labels();
	labels.setPadding(1);
	labels.setAlign(HorizontalAlign.LEFT);
	var style = new Style();
	style.setFontSize("16px");
	labels.setStyle(style);
	axis.setLabels(labels);

	axis.setGrid(new AxisGrid());
	axis.getGrid().setCellHeight(20);
}

image
image1047Ă—384 20.6 KB

2

Bug reports should be reported on GitHub GitHub · Where software is built

1 Like
3

Day and Week seems to be the default in Hightcharts Gantt, so you shouldn’t have to configure anything (see example here, where there is no specific configuration: Create Gantt Charts with Vaadin Charts)

Actually the scale is dynamic (automatic) so Gantt chart uses the best suited “resolution” for those two axis rows.

Otherwise, the Vaadin Gantt chart Java API is a lightweight wrapper over Highcharts API. So if I wanted to test if some problem is a Vaadin fault or Highcharts fault, I tried to configure Highcharts directly to see if the problem is in their implementation.
There are lot of Highchart demo configurations here:

and you can play in the playground for example here:
https://jsfiddle.net/u9pkytwm/

There is also a documentation on how to configure the Gantt axis here, but to be honest, it’s not much detailed:

4

@Bretislav1 Issue was reported and Guillermo already found the root cause GANTT timescales seem to mess up when adding days with weeks - Vaadin 24.7 · Issue #7223 · vaadin/flow-components · GitHub

5

Ahh… thanks @knoobie … sometimes things happen too fast :slight_smile:

2 Likes