Hi everyone,
I am migrating from Vaadin Charts 3 to 4.
Prior I was using the Timeline chart to display time based data with millisecond resolution.
After the upgrade the Chart resolutions seems limited to 1 second.
I did not find anything on setting the time resoltion. Am I missing something?
Kind Regards!
Charts 4 made it work on top of Framework 8 instead of Framework 7. It did change so much of the APIs, with the exception that the use of java.util.Date were deprecated and new methods with java.time.Instant from Java 8 were introduced.
As far as I see it, functionality should not have changed between these versions. Can you provide some sample on what you are doing?
This might be related. xAxis has minRange methods which might have an affect on what you are trying to achieve. Maybe try setting it specifically?
https://demo.vaadin.com/javadoc/com.vaadin/vaadin-charts/4.0.0/com/vaadin/addon/charts/model/XAxis.html#setMinRange-java.lang.Number-
The minimum range to display on this axis. The entire axis will not be allowed to span over a smaller interval than this. For example, for a datetime axis the main unit is milliseconds. … The default minRange for the x axis is five times the smallest interval between any of the data points.
Unfortunately setMinRange(1) did not seem to help here.
I prepared a small example:
this.setSizeFull();
Chart chart = new Chart();
this.addComponent(chart);
Configuration configuration = chart.getConfiguration();
XAxis xAxis = new XAxis();
xAxis.setType(AxisType.DATETIME);
xAxis.setMinRange(1);
configuration.addxAxis(xAxis);
Object[][]
data = new Object[][]
{ { "2017-11-12 11:19:21.098", 0d }, { "2017-11-12 11:19:21.099", 0.6d },
{ "2017-11-12 11:19:21.320", 0.7d } };
DataSeries dataSeries = new DataSeries();
DateTimeFormatter dateTimeFormatter = DateTimeFormatter.ofPattern("yyyy-MM-dd HH:mm:ss.SSS");
for (int i = 0; i < data.length; i++) {
Object[] ds = data[i]
;
LocalDateTime lineDate = LocalDateTime.parse((String) ds[0]
, dateTimeFormatter);
Instant instant = lineDate.toInstant(ZoneOffset.UTC);
System.out.println(instant);
DataSeriesItem item = new DataSeriesItem(instant, (Double) ds[1]
);
dataSeries.add(item);
}
configuration.setSeries(dataSeries);
chart.drawChart();Shameless bump:
Were you able to reproduce the issue? Is this a bug? Shall I create an issue on github?
Hm, so I added your sample to a hello world app. It is not a timeline chart, and it has only one data point visible for some reason, even if a quick skim indicates that it should have three. But the resolution of the timestamp is milliseconds. I’m going to look a bit closer to the sample, but I’m not 100% sure what you are going after here. isn’t it that it lists xAxis labels in ms?
Screenshot:
http://d.pr/i/K3DZgR
Allright now I see, there’s three data points which have time 11:19:21.098, 11:19:21.099 and 11:19:21.320 but in the rendering there is only 11:19:21.000 (no milliseconds) visible.
I found the issue, and it is a bug in Vaadin Charts code. The row that is causing the problem in your code is this row:
DataSeriesItem item = new DataSeriesItem(instant, (Double) ds[1]
);
That constructor will call:
public void setX(Instant instant) {
setX(Util.toHighchartsTS(instant));
}
An Util.toHighchartsTS(instant) converts the instant to epoch in a wrong way:
public static long toHighchartsTS(Instant date) {
return date.getEpochSecond()*1000;
}
That getEpochSeconds already discards the milliseconds so all datapoints will end up at HH:MM:SS.000. It should use date.toEpochMilli() instead.
I did an issue:
https://github.com/vaadin/charts/issues/475
and a pull request to fix it:
https://github.com/vaadin/charts/pull/476
.
As a workaround right now until we have a fixed version, use directly epoch longs instead of Instant instances, and it will work correctly.
DataSeriesItem item = new DataSeriesItem(instant.toEpochMilli(), (Double) ds[1]
);
Sorry for the bug.
No problem!
DataSeriesItem item = new DataSeriesItem(instant.toEpochMilli(), (Double) ds[1]
);
The workaround fixed the issue, thank you very much for looking into this!