Documentation
Tutorials
Getting started Advanced Widgets
Github Example Application

Module

AvailabilityTimeline

The availability timeline widget displays events during specific intervals shown chronologically along a line, indicating the availability and unavailability periods for each data group. The widget is designed to provide a broad overview of a sequence of events in time.

Tutorials:
See:

View Source widgets/availabilityTimeline.js, line 8

Methods

# setAxisClass(className)

Set a custom class for the axis.

Parameters:
Name Type Description
className string

Class name.

View Source widgets/availabilityTimeline.js, line 181

# setDataFormatter(formatter)

Set a custom function to format.

Parameters:
Name Type Description
formatter function

Callback JavaScript function.

View Source widgets/availabilityTimeline.js, line 461

# setDataHeight(height)

Set the height of the blocks.

Parameters:
Name Type Description
height number

Value in pixels.
Default Value:
  • 18

View Source widgets/availabilityTimeline.js, line 78

# setDatasetClass(className)

Set a custom class for the dataset.

Parameters:
Name Type Description
className string

Class name.

View Source widgets/availabilityTimeline.js, line 199

# setDataThreshold(threshold)

Set a custom data threshold.

Parameters:
Name Type Description
threshold number

Threshold value.
Default Value:
  • 1

View Source widgets/availabilityTimeline.js, line 254

# setDateFormatter(formatter)

Set the default formatter for dates.

Parameters:
Name Type Description
formatter string

Formatter.
Default Value:
  • "DD/MM/YYYY HH:mm:SS"

View Source widgets/availabilityTimeline.js, line 136

# setGAxisClass(className)

Set a custom class for the grid axis.

Parameters:
Name Type Description
className string

Class name.

View Source widgets/availabilityTimeline.js, line 172

# setGDataClass(className)

Set a custom class for the data.

Parameters:
Name Type Description
className string

Class name.

View Source widgets/availabilityTimeline.js, line 190

# setGrouping(grouping)

Set the grouping interval.

Parameters:
Name Type Description
grouping number

Milliseconds.

View Source widgets/availabilityTimeline.js, line 54

# setGTitleClass(className)

Set a custom class for the title of the grid.

Parameters:
Name Type Description
className string

Class name.

View Source widgets/availabilityTimeline.js, line 163

# setHasDataClass(className)

Set a custom class when has data.

Parameters:
Name Type Description
className string

Class name.

View Source widgets/availabilityTimeline.js, line 217

# setHasNoDataClass(className)

Set a custom class when have no data.

Parameters:
Name Type Description
className string

Class name.

View Source widgets/availabilityTimeline.js, line 226

# setHorzGridClass(className)

Set a custom class for the horizontal grid.

Parameters:
Name Type Description
className string

Class name.

View Source widgets/availabilityTimeline.js, line 154

# setIconCancel(iconName)

Set custom icon for when no data is available.

Parameters:
Name Type Description
iconName string

View Source widgets/availabilityTimeline.js, line 290

# setIconOk(iconName)

Set custom icon for when data is available.

Parameters:
Name Type Description
iconName string

View Source widgets/availabilityTimeline.js, line 281

# setKey(key)

Set the column name to show.

Parameters:
Name Type Description
key string

Column name.

View Source widgets/availabilityTimeline.js, line 36

# setLegendClass(className)

Set a custom class for the legend.

Parameters:
Name Type Description
className string

Class name.

View Source widgets/availabilityTimeline.js, line 443

# setLegendHeight(height)

Set a custom height for the legend.

Parameters:
Name Type Description
height number

Value in pixels.
Default Value:
  • 15

View Source widgets/availabilityTimeline.js, line 406

# setLegendMarginH1(margin)

Set a custom margin between the title and the content of the legend.

Parameters:
Name Type Description
margin number

Value in pixels.
Default Value:
  • 17

View Source widgets/availabilityTimeline.js, line 386

# setLegendMarginH2(margin)

Set a custom margin between the subtitle and the content of the legend.

Parameters:
Name Type Description
margin number

Value in pixels.
Default Value:
  • 2

View Source widgets/availabilityTimeline.js, line 396

# setLegendMarginLeft(margin)

Set a custom margin left for the legend.

Parameters:
Name Type Description
margin number

Value in pixels.
Default Value:
  • 20

View Source widgets/availabilityTimeline.js, line 366

# setLegendMarginTop(margin)

Set a custom margin top for the legend.

Parameters:
Name Type Description
margin number

Value in pixels.
Default Value:
  • 8.5

View Source widgets/availabilityTimeline.js, line 376

# setLegendTop(margin)

Set a custom margin top for the legend.

Parameters:
Name Type Description
margin number

Legend top.
Default Value:
  • 11

View Source widgets/availabilityTimeline.js, line 346

# setLegendUnits(units)

Set a custom unit for the values.

Parameters:
Name Type Description
units string

Unit.

View Source widgets/availabilityTimeline.js, line 452

# setLegendWidth(width)

et a custom width for the legend.

Parameters:
Name Type Description
width number

Value in pixels.
Default Value:
  • 15

View Source widgets/availabilityTimeline.js, line 416

# setLineSpacing(spacing)

Set the spacing between of the blocks.

Parameters:
Name Type Description
spacing number

Value in pixels.
Default Value:
  • 14

View Source widgets/availabilityTimeline.js, line 88

# setMargin(margin)

Set all margins around the widget: top, bottom, left and right.

Parameters:
Name Type Description
margin Object
top number

Value in pixels.
right number

Value in pixels.
bottom number

Value in pixels.
left number

Value in pixels.
Default Value:
  • {top: 100, right: 40, bottom: 20, left: 100}

View Source widgets/availabilityTimeline.js, line 68

# setPaddingBottom(padding)

Set the padding bottom.

Parameters:
Name Type Description
padding number

Value in pixels.
Default Value:
  • 10

View Source widgets/availabilityTimeline.js, line 108

# setPaddingLeft(padding)

Set the padding left.

Parameters:
Name Type Description
padding number

Value in pixels.

View Source widgets/availabilityTimeline.js, line 117

# setPaddingTopHeading(padding)

Set the padding top of the heading.

Parameters:
Name Type Description
padding number

Value in pixels.
Default Value:
  • -50

View Source widgets/availabilityTimeline.js, line 98

# setSubheadingClass(className)

Set a custom class for the subtitle.

Parameters:
Name Type Description
className string

Class name.

View Source widgets/availabilityTimeline.js, line 336

# setSubtitleDateFormat(format)

Set the default formatter for the subtitle dates.

Parameters:
Name Type Description
format string

Formatter.
Default Value:
  • "DD/MM/YYYY HH:mm:ss"

View Source widgets/availabilityTimeline.js, line 327

# setSubtitleTop(margin)

Set a custom margin top for the subtitle.

Parameters:
Name Type Description
margin number

Value in pixels.
Default Value:
  • 17

View Source widgets/availabilityTimeline.js, line 356

# setTextHasData(text)

Parameters:
Name Type Description
text string

Text when data is present

View Source widgets/availabilityTimeline.js, line 424

# setTextHasNotData(text)

Set a custom text to show when no data.

Parameters:
Name Type Description
text string

Custom text.
Default Value:
  • "No data available"

View Source widgets/availabilityTimeline.js, line 434

# setTimelineTitle(title)

Set a custom title for the timeline.

Parameters:
Name Type Description
title string

Text of the title.
Default Value:
  • "Data Availability Plot"

View Source widgets/availabilityTimeline.js, line 308

# setTitleClass(className)

Set a custom class for the title.

Parameters:
Name Type Description
className string

Class name.

View Source widgets/availabilityTimeline.js, line 317

# setToolTipClass(className)

Set a custom class for the tooltip.

Parameters:
Name Type Description
className string

Class name.

View Source widgets/availabilityTimeline.js, line 126

# setTooltipHasDataClass(className)

Set a custom class for the tooltip when has data.

Parameters:
Name Type Description
className string

Class name.

View Source widgets/availabilityTimeline.js, line 263

# setTooltipHasNoDataClass(className)

Set a custom class for the tooltip when have no data.

Parameters:
Name Type Description
className string

Class name.

View Source widgets/availabilityTimeline.js, line 272

# setTransitionDuration(duration)

Parameters:
Name Type Description
duration number

View Source widgets/availabilityTimeline.js, line 234

# setTransitionOpacity(opacity)

Set a custom time for the opacity transition.

Parameters:
Name Type Description
opacity number

Time in milliseconds.
Default Value:
  • 200

View Source widgets/availabilityTimeline.js, line 244

# setValue(key)

Set the column with the value to show.

Parameters:
Name Type Description
key string

Column name.

View Source widgets/availabilityTimeline.js, line 45

# setVertGridClass(className)

Set a custom class for the vertical grid.

Parameters:
Name Type Description
className string

Class name.

View Source widgets/availabilityTimeline.js, line 145

# setYTitleClass(className)

Set a custom class for the Y axis title.

Parameters:
Name Type Description
className string

Class name.

View Source widgets/availabilityTimeline.js, line 208