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

Section	Option	Description
	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