How to adjust your horizontal timeline for mobile

With long horizontal timelines, you may notice that your events stretch too much, which makes the content harder to read on smaller screens. While the user's ability to use a swipe motion to scroll through the timeline may be a useful workaround, there is another alternative for you to prevent this from happening in the first place. Read how to do this below. 

Each event is too long to fit entirely on mobile screen sizes
1
Under Timeline > Height mode, select Aspect ratio.

2
You will notice that this setting allows you to control the aspect ratio of the visualization in both desktop and mobile mode.


3
Under Mobile aspect, select the first or second option.

4
Alternatively, you can set up a custom aspect ratio. An aspect ratio of:
  • =1: equals a square
  • <1: makes the visualization taller
  • >1: makes the visualization wider
In order to prevent your events from stretching, you need to make your visualization taller. Therefore, choose the most suitable option between 0.1 and 1.

5
That's it! Don't forget to preview your visualization at typical mobile width to make sure your events fit as expected.

Related Articles