Timeline

Purpose & Application

This chart is generally used to represent a significant event for an institution or a particular individual.

This chart shows events descriptions and images in a carousel-like fashion way with a slider that allows the selection of the date.

๐Ÿ“ For example, I want to see the milestones of my project since the launching date

Key Features

  • Media and communication tool, this is what Toucan is! ๐Ÿ“… Every story has a timeline, a chronology, and is made of a series of events. Use the timeline to properly show it.

Letโ€™s say we are on a Advertising monitoring application, most of your stories are showing advertising results and impacts. Wouldnโ€™t be cool to have a visual summary of all advertising made?

  • Easy to configure, just follow the steps from the Studio, and youโ€™re all set. We take care of the design for you ๐Ÿ™Œ

Remember those nights editing a ppt and having to move/re-align every image and text? Gone ๐Ÿคฉ

  • Easy to use, your users wonโ€™t have any trouble navigating thru time with our slick design and mobile display. ๐Ÿคณ

Configuration

To display events related to time in exhaustive way

* Mandatory paramers

SectionOptionDescription

Dataset*

Select the dataset used by the chart

Start Date*

Select the column that contains containing the date for each event

Headline*

Select the column that contains a short title display for each event

Text*

Select the column that contains the description of each event

Legend

Additional info

Add another column for more information on the legend

Enrich Chart

Media

Select the column that contains the URL or the name of the asset in Toucan

Enrich Chart

Media Type

Select the column that contains the type of media | The column should contain external or asset as values

Enrich Chart

Image's legend

Select the column that contains a text to be displayed under the image/media

Enrich Chart

Content

Select the column that contains additional content to be display under the description

Display

Size

Define the chart size when having multiple ones

Display

Mobile Size

Define the chart size when having multiple ones on mobile

Display

Custom CSS Class

Set a custom CSS class to target this specific chart with CSS

Tutorial

Tutorial

Set a tutorial to help your users to understand the chart by giving him an id and a message

Last updated