Documentation
Tutorials
Getting started Advanced Widgets
Github Example Application

Module

HeatCalendar

The heat calendar widget shows a calendar with the days marked in different colors. These colors depend on the amount of data per day and a gradient scale that you can see below.

Tutorials:
See:

View Source widgets/heatCalendar.js, line 38

Methods

# setColorScale(scale)

Set a color scale. Currently it has to be an array of colors in d3. The first color is used for tables without data. The rest, to map from the minimum to the maximum value in a linear way.

Parameters:
Name Type Description
scale Array.<string>

Colors scale.
Default Value:
  • ["#006837", "#1A9863", "#66BD63","#A6D96A", "#D9EF8B", "#FFFFBF","#FEE08B", "#FDAE61", "#F46D43","#D73027", "#A50026"]

View Source widgets/heatCalendar.js, line 329

# setDataOperation(dataOperation)

Apply an operation for data.

Allowed values are:

  • arctag: Arctangent.
  • log: Logarithm.
  • none: No operation
Parameters:
Name Type Description
dataOperation string

Operation name.
Default Value:
  • 'none'

View Source widgets/heatCalendar.js, line 344

# setDayLineColor(color)

Set a custom color of the internal lines of the calendar that delimit the days.

Parameters:
Name Type Description
color string

Color.
Default Value:
  • '#555555'

View Source widgets/heatCalendar.js, line 109

# setDiscardMethod(discardMethod)

Method to discard maximums and minimums.

Methods allowed:

  • stdDev: Standard deviation.
  • 5percent: Percentile 5%-95%.
  • 10percent: Percentile 10%-90%.
  • 20percent: Percentile 20%-20%.
  • none: None.
Parameters:
Name Type Description
discardMethod string

Method name.
Default Value:
  • 'none'

View Source widgets/heatCalendar.js, line 401

# setDisplayDayLegend(bool)

Set visible days legend.

Parameters:
Name Type Description
bool boolean
Default Value:
  • false

View Source widgets/heatCalendar.js, line 226

# setDisplayMark(bool)

Set enable display marks.

Parameters:
Name Type Description
bool boolean
Default Value:
  • true

View Source widgets/heatCalendar.js, line 236

# setDisplayScale(bool)

Set display the scale

Parameters:
Name Type Description
bool boolean
Default Value:
  • false

View Source widgets/heatCalendar.js, line 286

# setDisplaySelectors(bool)

Set visible the selectors.

Parameters:
Name Type Description
bool boolean
Default Value:
  • false

View Source widgets/heatCalendar.js, line 411

# setDisplayWeekDays(bool)

Shows the days of the week.

Parameters:
Name Type Description
bool boolean
Default Value:
  • false

View Source widgets/heatCalendar.js, line 216

# setEvent(str, func)

Attach an event handler function for one event to the widget.

Parameters:
Name Type Description
str string

Name of the event to listen.
func function

Callback JavaScript function.

View Source widgets/heatCalendar.js, line 95

# setLabelMargin(margin)

Set the margin for the label.

Parameters:
Name Type Description
margin number

Margin value.
Default Value:
  • 35

View Source widgets/heatCalendar.js, line 276

# setLeftmargin(margin)

Set left margin to wrap the chart.

Parameters:
Name Type Description
margin number

Margin value.
Default Value:
  • 12

View Source widgets/heatCalendar.js, line 256

# setLegendSelectorColor(color)

Set the color for the legend selector.

Parameters:
Name Type Description
color string

Color
Default Value:
  • 'white'

View Source widgets/heatCalendar.js, line 170

# setLeyendMaxValColor(color)

Set the custom color for the legend maximun value.

Parameters:
Name Type Description
color string

Color.
Default Value:
  • '#dddddd'

View Source widgets/heatCalendar.js, line 140

# setLeyendMinValColor(color)

Set the custom color for the legend minimun value.

Parameters:
Name Type Description
color Object

Color.
Default Value:
  • '#dddddd'

View Source widgets/heatCalendar.js, line 150

# setMaxPercentil(percentil)

Set the maximun percentile score.

Parameters:
Name Type Description
percentil number

Percentil value. Value between 0 and 1.
Default Value:
  • null

View Source widgets/heatCalendar.js, line 384

# setMaxPercentilColor(color)

Set the maximun percentile color.

Parameters:
Name Type Description
color string

Color.
Default Value:
  • #BA55D3

View Source widgets/heatCalendar.js, line 364

# setMinPercentil(percentil)

Set the minimun percentile score.

Parameters:
Name Type Description
percentil number

Percentil value. Value between 0 and 1.
Default Value:
  • null

View Source widgets/heatCalendar.js, line 374

# setMinPercentilColor(color)

Set the minimum percentile color.

Parameters:
Name Type Description
color string

Color.
Default Value:
  • #87CEEB

View Source widgets/heatCalendar.js, line 354

# setMondayFirst(bool)

Set Monday as firts day of week.

Parameters:
Name Type Description
bool boolean
Default Value:
  • false

View Source widgets/heatCalendar.js, line 198

# setMonthLabelColor(color)

Set the date label color.

Parameters:
Name Type Description
color string

Color.
Default Value:
  • 'none'

View Source widgets/heatCalendar.js, line 130

# setMonthLineColor(color)

Set a custom color of the internal lines of the calendar that delimit the months.

Parameters:
Name Type Description
color string

Color.
Default Value:
  • '#eeeeee'

View Source widgets/heatCalendar.js, line 120

# setMoveDaysLabels(bool)

Allow to shift the days of the week.

Parameters:
Name Type Description
bool boolean
Default Value:
  • true

View Source widgets/heatCalendar.js, line 190

# setOpacity(opacity)

Set the opacity for colors.

Parameters:
Name Type Description
opacity number

Opacity. Number between 0 and 1.
Default Value:
  • 1

View Source widgets/heatCalendar.js, line 246

# setScaleHeight(scale)

Set a custom scale height.

Parameters:
Name Type Description
scale number

Scale value.
Default Value:
  • 15

View Source widgets/heatCalendar.js, line 306

# setScaleMargin(scale)

Set a custom margin for the scale.

Parameters:
Name Type Description
scale number

Scale value.
Default Value:
  • 15

View Source widgets/heatCalendar.js, line 296

# setScaleSize(scale)

Set a custom scale size.

Parameters:
Name Type Description
scale Array.<number>

Scale size.
Default Value:
  • [0.25, 0.75]

View Source widgets/heatCalendar.js, line 316

# setTimestampKey(timestampKey)

Set a custum timespamp key. The data should be ordered by this column.

Parameters:
Name Type Description
timestampKey string

Column name.

View Source widgets/heatCalendar.js, line 66

# setToBytes(bool)

Set the values as units of bytes.

Parameters:
Name Type Description
bool boolean
Default Value:
  • false

View Source widgets/heatCalendar.js, line 208

# setTopmargin(margin)

Set the top margin of the chart.

Parameters:
Name Type Description
margin number

Margin value.
Default Value:
  • 50

View Source widgets/heatCalendar.js, line 266

# setValue(value)

Set the value to show.

Parameters:
Name Type Description
value string

Column name.

View Source widgets/heatCalendar.js, line 75

# setWeekDayFontColor(color)

Set the color for week days labels.

Parameters:
Name Type Description
color string

Color.
Default Value:
  • '#ffffff'

View Source widgets/heatCalendar.js, line 160

# setWeekDaysLabels(days)

Set custom labels for days of weeks.

Parameters:
Name Type Description
days Array.<string>

Days of week labels.
Default Value:
  • ['S', 'M', 'T', 'W', 'T', 'F', 'S']

View Source widgets/heatCalendar.js, line 180