Timeline in Vaadin 7 and vaadin-charts 1.0.0-beta4: Vertical Axis not fit

Flow
1

Hello,

I’m new with the timeline chart. I create a timeline chart with line values form 1000 to 1300.
And I have some problems with it:

(1) The Chart is always bases on zero. That means the vertical range is from 0 to 1300 and not form 1000 to 1300 as expected is there a way to fit the vertical range automatically?

(2) When I zoom into the chart so that I can see date from 1000 to 1100 the vertical range is still 0 to 1300 and not 0 to 1100.

I already tried to call

setVerticalAxisRange(null,null)

but without any effect.

I hope you can help me here.

Kind Regards,
Rainer

Here is the complete example that I’m using for testing:


package org.langohr.fundsfinder.view.chart;

import com.vaadin.addon.timeline.Timeline;
import com.vaadin.data.Container;
import com.vaadin.data.Item;
import com.vaadin.data.util.IndexedContainer;
import com.vaadin.server.VaadinRequest;
import com.vaadin.ui.UI;

import java.util.Calendar;
import java.util.Date;
import java.util.GregorianCalendar;

public class ChartBug extends UI {

    @Override
    protected void init(VaadinRequest request) {
        final Timeline timeline = new Timeline();
        timeline.addGraphDataSource(createData(), Timeline.PropertyId.TIMESTAMP, Timeline.PropertyId.VALUE);
        timeline.setSizeFull();

        // Try to force fit vertical range - without any result
        timeline.setVerticalAxisRange(null,null);

        // also that does not work:
        timeline.addListener(new Timeline.DateRangeListener() {
            @Override
            public void dateRangeChanged(Timeline.DateRangeChangedEvent event) {
                timeline.setVerticalAxisRange(null,null);
            }
        });

        this.setContent(timeline);
    }

    /**
     * Creates data source with entries form 1000 to 1300
     */
    private static final Container.Indexed createData() {

        // Create the container
        IndexedContainer container = new IndexedContainer();
        container.addContainerProperty(Timeline.PropertyId.TIMESTAMP,
                Date.class, null);
        container.addContainerProperty(Timeline.PropertyId.VALUE,
                Integer.class, 0);

        Calendar cal = new GregorianCalendar(2011, Calendar.NOVEMBER, 1);
        Date end = cal.getTime();
        cal.add(Calendar.MONTH, -1);

        long counter = 0;

        while (counter < 300) {
            Item item = container.addItem(cal.getTime());
            item.getItemProperty(Timeline.PropertyId.TIMESTAMP).setValue(
                    cal.getTime());
            float val = 1000 + counter;
            item.getItemProperty(Timeline.PropertyId.VALUE).setValue(
                    Math.round(val));
            cal.add(Calendar.DAY_OF_MONTH, 1);
            counter++;
        }
        return container;
    }
}
2


(1) The Chart is always bases on zero. That means the vertical range is from 0 to 1300 and not form 1000 to 1300 as expected is there a way to fit the vertical range automatically?

No. Automatically the chart will always base itself on zero. The Timeline does not automatically center around anything else since it then would need to iterate the whole data set and search for the minimum and maximum. Instead, if you don’t want to base it on zero the you should set the vertical axis range manually using the
Timeline.setVerticalAxisRange(min, max)
 method.


(2) When I zoom into the chart so that I can see date from 1000 to 1100 the vertical range is still 0 to 1300 and not 0 to 1100.

When using automatic axis range the vertical axis range will only grow when browsing the Timeline, it will not shrink. If the maximum point at some point was 1300 the graph will remain this big even if that point no longer is visible in the graph.