Line Chart with missing values

Flow
1

We a trying to use a Line chart to visualize some data, unfortunately some of the data points are missing or unknown.

I do not want to use zero in their place as the are not zero and this would give the Line chart a unrealistic shape.

I have tried using “null” but the Line Chart simply stops drawing at the first missing point.

Is there a way to have the Line Chart to draw completely and either miss out the points is does not know or interpolating the line between the nearest known points

2

Hi Martin,

Sorry to hear that you have faced problems with Vaadin Charts.

Actually, you should be able to set the value to be ‘null’. In that case, the value in that positions is not visible so there will be a gap in the line. I think this is want you wanted?

Here’s an example using ListSeries:

listSeries.setData(7.0, 6.9, null, 14.5, 18.2, null, null, 26.5, 23.3, 18.3, 13.9, 9.6);

Then you could update the data later and the gaps will be filled.

[code]
Button update = new Button(“Update”, new Button.ClickListener() {

@Override public void buttonClick(Button.ClickEvent clickEvent) {
listSeries.updatePoint(2, 9.5);
listSeries.updatePoint(5, 21.5);
listSeries.updatePoint(6, 25.2);
}
});
[/code]I hope this answer helps you. If you still have a problem, could you provide an code example which reproduces your problem.

BR,
Jarno

3

Hi Jarno,

Your example above does work, unfortunately I am adding data to my chart via the DataSeries and DataSeriesItems and this does not work when nulls are used

    DataSeries ds = new DataSeries("Test");
    DataSeriesItem dsi = new DataSeriesItem("1", 99);
    ds.add(dsi);

    DataSeriesItem ds1 = new DataSeriesItem("2", 165);
    ds.add(ds1);
    DataSeriesItem ds2 = new DataSeriesItem("3", null);
    ds.add(ds2);
    DataSeriesItem ds3 = new DataSeriesItem("4", 200);
    ds.add(ds3);
    DataSeriesItem ds4 = new DataSeriesItem("5", 99);
    ds.add(ds4);

    configuration.addSeries(ds);

Would you expect this to be supported?

Thanks

Martin

4

Hi Martin,

Yes, I would expect that to work. Now, I were able to reproduce the issue you mentioned. That shouldn’t happen. The problem is that ‘y’ value is not written at all to json configuration. I have created a ticket about this issue https://dev.vaadin.com/ticket/19346

The simplest workaround would be to use ListSeries instead or DataSeriesItem with only x and y values:
DataSeriesItem dsi = new DataSeriesItem(1, 99); ds.add(dsi); DataSeriesItem ds1 = new DataSeriesItem(2, 165); ds.add(ds1); DataSeriesItem ds2 = new DataSeriesItem(3, null); ds.add(ds2); DataSeriesItem ds3 = new DataSeriesItem(4, 200); ds.add(ds3); DataSeriesItem ds4 = new DataSeriesItem(5, 99); ds.add(ds4); Would this work for you? Another option would be to create a custom Gson instance which would handle the y value correctly.

Hopefully this helps,
Jarno

5

This bugs still affects me will this be solved anywhere in the near futur?