Change default RangeSelector Buttons


I have been trying to change the default Buttons of the RangeSelector component when you enable timeline on a chart.
But there’s no way to do it, the javadoc suggest to use the setButtons method which receives a Buttons object.

There’s no clear example in no where about how to change the default values. Although the javadoc says that it is possible to do it.

This is the available javadoc info:

public void setButtons(Buttons buttons)
An array of configuration objects for the buttons. The individual options for each item are:
Defines the timespan, can be one of ‘millisecond’, ‘second’, ‘minute’, ‘day’, ‘week’, ‘month’, ‘ytd’ (year to date), ‘year’ and ‘all’.
Defines how many units of the defined type to use.
A custom data grouping definition for the button.
The text for the button itself
Defaults to
buttons: [{
type: ‘month’,
count: 1,
text: ‘1m’
}, {
type: ‘month’,
count: 3,
text: ‘3m’
}, {
type: ‘month’,
count: 6,
text: ‘6m’
}, {
type: ‘ytd’,
text: ‘YTD’
}, {
type: ‘year’,
count: 1,
text: ‘1y’
}, {
type: ‘all’,
text: ‘All’

I honestly don’t now how to set the Buttons array, the example there doesn’t even look like java code. Please help me, I want a clear example on how to set the buttons to milliseconds, seconds or minutes as described in the javadoc that you should be able to do it.

Thanks a lot.

Seems to be that the documentation there is misleading. I have reported the issue to the Charts team. In the meanwhile I’m not sure if it’s possible to set the range selector buttons as the setButtons method is for the export and print buttons.

I heard from the team that there should be a fix coming in the next release candidate. Let’s hope it happens. I’m keeping fingers crossed.

I am very sorry to hear that right now it is not possible. I have column chart with timeline enabled and what I need is that the navigator starts in the range of one hour. With the current options you can just set it to one month, 3 months, 6 months, one year or all the time range of the chart. Don’t you think that’s too bad? I mean, it is a time range, I should be able to set it to seconds, minutes, hours, etc. All I can do now is let the user adjust the time range, but it is not enough to me as the main content that I am presenting in my chart is within the range of hours. I’ll have to tell my customer that it is not possible to fill his requeriment because I am waiting for a fix from you guys. I hope you fix this soon, because the license of your product is not cheap and it is amazing that these little basic things aren’t covered. If you compare Vaadin Charts with Highcharts, you’re missing a lot of stuff. I am paying too much money for something that is not letting me do my job, too bad. Me and my team had encountered many troubles with Vaadin Charts, but as we already adopted it and we are on a point of no return, we have to keep using it, just hope you fix all the missing key components soon. The Tooltip for example is so limited, so uncustomizable. I’ll write another post for that matter too.

Now in Charts 3.0.0-rc2 there is a RangeSelectorButton class you can use with setButtons method. The javadoc still seems to be incorrect, but at least the API is now fixed.

Well, thanks for the update!! I’ll try it with my team and see how it works!