It is currently Fri Oct 20, 2017 3:13 am Advanced search

Responsive and rangeselector

Technical support for the Highcharts Stock package

Responsive and rangeselector

Postby fbispo » Thu Sep 21, 2017 11:55 am

Hi there.
I'm using highstocks to generate a graph with 3 series, and I wanted the buttons to ocuppy the full width of the upper part of the graph. As such I tweaked with the widths so I would get what I want.

The problem is in responsive, because when I open the graph on a mobile phone the buttons don't fit the screen. So I tried to change them with responsive by diminishing the size and by change the text, but it isn't working.

Can you guy tell me if this feature rangeSelector is not available in chartoptions in responsive?

best regards, Filipe Bispo.
fbispo
 
Posts: 2
Joined: Wed Sep 20, 2017 5:32 pm

Re: Responsive and rangeselector

Postby kamil » Fri Sep 22, 2017 9:33 am

Hi Filipe,

Here's an example that may help your: http://jsfiddle.net/kkulig/xtkw9bb2/

This function positions the buttons to occupy the full width of the chart:
Code: Select all
  function adjustButtonsWidth(chart) {
    var space = 10, // between the buttons
      buttons = chart.rangeSelector.buttons,
      baseX = buttons[0].x,
      buttonsAreaWidth = chart.chartWidth - baseX - chart.spacing[1],
      buttonWidth = (buttonsAreaWidth - (buttons.length - 1) * space) / buttons.length;

    buttons.forEach(function(button, i) {
      button.attr({
        x: baseX + i * (buttonWidth + space)
      });
      button.box.attr({
        width: buttonWidth
      });
    });
  }]

In needs to be called on load and redraw events to be responsive.

Best regards!
Kamil Kulig
Highcharts Developer
kamil
 
Posts: 432
Joined: Tue May 30, 2017 11:12 am

Re: Responsive and rangeselector

Postby fbispo » Thu Oct 12, 2017 6:28 pm

I ended up doing something different, but this helped. Thanks Kamil
fbispo
 
Posts: 2
Joined: Wed Sep 20, 2017 5:32 pm


Return to Highstock Usage

Who is online

Users browsing this forum: No registered users and 2 guests