Table of Contents

Layout

Layout page has 3 sections:

  • Toolbar buttons
  • Appearance
  • Colors
  • Width and Height

Layout Page

Toolbar buttons

These toolbar buttons toggles certain buttons on top of the Timeline.

Show Collapse All / Expand All

This button collapses/expands all the groups in a timeline.

Show Refresh

This button refreshes a Timeline.

Show Scale Type

This toggles a selectbox in the toolbar. Any user can use this at runtime to change the scale of a Timeline.

Appearance

Fixed Scale Type

Sets initial scale type of a Timeline.

Start Timeline At

Sets the point at which the Timeline should start.

Highlight Current Time

Draws a red line over the current time on the Timeline.

Live Scrolling Mode

Keeps the timeline view continuously updated by automatically scrolling as time progresses. This is useful for devices without user interaction like tv screens on walls.

Stacked

Stacks items with overlapping start date or end date on top of each other to make sure they're both visible.

Extend Items/Zones

Makes every item/zone their end date the same as the start date of the next item. This will make the items/zones follow up on each other.

Zoom Enabled

Enables zoom functionality.

Zoom Friction

The zoom friction setting controls how smoothly and quickly zooming occurs. It determines the rate at which the zoom effect is applied when a user interacts with the zoom functionality on the Timeline.

Minimum Zoom Scale

Determines how far a user can zoom out based on time scale. This should not be higher than the Maximum Zoom Scale.

Maximum Zoom Scale

Determines how far a user can zoom in based on time scale. This should not be lower than the Maximum Zoom Scale.

Formatters

Items Text

Defines a template for the items text.

Tooltip Text

Defines a template for the tooltip on hover of an item.

Zones Text

Defines a template for the zone text.

Disabling one of these formatters defaults to empty.

To learn more about how to use a formatter, view Display Text

Colors

Color Levels & Items

Color Levels give custom colors to grouping levels.

Color Items will give the items a default color to fallback to.

When disabled, it will use the default colors from theme file.

Items & Zones color fields

Just like the mapping in items & zones, we can select the method field for the color mapping here.

Status Colors

You can add status colors by clicking on the "Add Color" button. This will create a status color field.

On the left, you have a text box where you can put in the text it should match. On the right there is a color palette you can use to to select a color the item will change into when the status matches the label you put in.

Easily delete the status color by using the trashcan button.

Width and Height

First, select a unit type for the width or height of the Timeline.

We currently support the following types:

  • auto
  • px (pixels of screen)
  • % (% of relative parent)

After selecting a unit type, fill in the value text box.