Maxime74
Posts: 73
Joined: Wed Sep 17, 2014 8:34 am

Range Selector width and alignement

Hi there,

When an offset is set to the yAxis (and some more customisation), I can't manage to set the range selector to align with right side of the rendering div instead of the plot area.

See : http://jsfiddle.net/kzb7t49n/1/

Any clue ?
wojtek
Posts: 433
Joined: Tue Jul 03, 2018 12:32 pm

Re: Range Selector width and alignement

Hi Maxime74,

Highcharts documentation "The navigator is a small series below the main series, displaying a view of the entire data set". So navigator is just an additional series, that's why it's placed in the plot area. Unfortunately, there is no property to align it to the right side of rendering div.

Kind regards.
Wojciech Chmiel
Highcharts Developer
Maxime74
Posts: 73
Joined: Wed Sep 17, 2014 8:34 am

Re: Range Selector width and alignement

Hi Wojtek,

I'm talking about the range selector.
I join a screenshot to illustrate what I mean :
Image
infiniti qx60 0 60
bastss
Site Admin
Posts: 1192
Joined: Wed Oct 17, 2018 10:59 am

Re: Range Selector width and alignement

Hi Maxime74,

I think there's solution of your problem.

http://jsfiddle.net/Bastss/ahk5smzv/

In cases like this setting input position/button position inside rangeSelector is helpful.

https://www.highcharts.com/docs/chart-c ... e-selector - like here.

Best regards,
Sebastian Wędzel,
Highcharts Developer
Maxime74
Posts: 73
Joined: Wed Sep 17, 2014 8:34 am

Re: Range Selector width and alignement

Bastss,

These settings could do the trick if I had a fix width for my yAxis.
But this chart is a template for my website. So I can't know how much place will the labels take within the yAxis, depending on the values of the series displayed.
bastss
Site Admin
Posts: 1192
Joined: Wed Oct 17, 2018 10:59 am

Re: Range Selector width and alignement

Maxime74,

So, now the x value for input position is updating and depending on the values of the series.
In chart object you can find values of marginRight and spacing (used in demo below) .

https://jsfiddle.net/Bastss/mh42do5p/

Helpful explanation used functions.
https://api.highcharts.com/class-refere ... art#update
https://api.highcharts.com/highcharts/chart.events.load

Best regards
Sebastian Wędzel,
Highcharts Developer
Maxime74
Posts: 73
Joined: Wed Sep 17, 2014 8:34 am

Re: Range Selector width and alignement

It seems to be what I'm looking for.
Thanks for your help.

Return to “Highcharts Stock”