heatmap

Heatmap

Reusable Heatmap API module that renders a simple and configurable heatmap chart.

Requires: module:d3-array,
Example

let heatmap = heatmap();

heatmap
    .width(500);

d3Selection.select('.css-selector')
    .datum(dataset)
    .call(heatmap);

• Heatmap
  • exports(_selection, _data) ⏏
    • static
      • .animationDuration(_x) ⇒ duration | module
      • .boxSize(_x) ⇒ Number | module
      • .colorSchema(_x) ⇒ Array.<String> | module
      • .exportChart(filename, title)
      • .height(_x) ⇒ Number | module
      • .isAnimated(_x) ⇒ Boolean | module
      • .margin(_x) ⇒ margin | module
      • .on() ⇒ module
      • .yAxisLabels(_x) ⇒ yAxisLabels | module
      • .width(_x) ⇒ Number | module
    • inner
      • ~HeatmapData : Array.<Array>

exports(_selection, _data) ⏏

This function creates the graph using the selection as container

Kind: Exported function

Param	Type	Description
_selection	D3Selection	A d3 selection that represents the container(s) where the chart(s) will be rendered
_data	HeatmapData	The data to attach and generate the chart

exports.animationDuration(_x) ⇒ duration | module

Gets or Sets the duration of the animation

Kind: static method of exports
Returns: duration | module - Current animation duration or Chart module to chain calls
Access: public

Param	Type	Default	Description
_x	Number	1200	Desired animation duration for the graph

exports.boxSize(_x) ⇒ Number | module

Gets or Sets the boxSize of the chart

Kind: static method of exports
Returns: Number | module - Current boxSize or Chart module to chain calls
Access: public

Param	Type	Default	Description
_x	Number	30	Desired boxSize for the heatmap boxes

exports.colorSchema(_x) ⇒ Array.<String> | module

Gets or Sets the colorSchema of the chart

Kind: static method of exports
Returns: Array.<String> | module - Current colorSchema or Chart module to chain calls
Access: public

Param	Type	Default	Description
_x	Array.<String>	britecharts-red	Desired colorSchema for the heatma boxes

exports.exportChart(filename, title)

Chart exported to png and a download action is fired

Kind: static method of exports
Access: public

Param	Type	Description
filename	String	File title for the resulting picture
title	String	Title to add at the top of the exported picture

exports.height(_x) ⇒ Number | module

Gets or Sets the height of the chart

Kind: static method of exports
Returns: Number | module - Current height or Chart module to chain calls
Access: public

Param	Type	Default	Description
_x	Number	270	Desired height for the chart

exports.isAnimated(_x) ⇒ Boolean | module

Gets or Sets the isAnimated value of the chart

Kind: static method of exports
Returns: Boolean | module - Current isAnimated value or Chart module to chain calls
Access: public

Param	Type	Default	Description
_x	Boolean	false	Decide whether to show chart animation

exports.margin(_x) ⇒ margin | module

Gets or Sets the margin of the chart

Kind: static method of exports
Returns: margin | module - Current margin or Chart module to chain calls
Access: public

Param	Type	Description
_x	Object	Margin object to get/set

exports.on() ⇒ module

Exposes an 'on' method that acts as a bridge with the event dispatcher We are going to expose this events: customMouseOver, customMouseMove, customMouseOut, and customClick

Kind: static method of exports
Returns: module - Bar Chart
Access: public

exports.yAxisLabels(_x) ⇒ yAxisLabels | module

Gets or Sets the y-axis labels of the chart

Kind: static method of exports
Returns: yAxisLabels | module - Current yAxisLabels array or Chart module to chain calls
Access: public

Param	Type	Default	Description
_x	Array.<String>	['Mo',	'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su'] An array of string labels across the y-axis

exports.width(_x) ⇒ Number | module

Gets or Sets the width of the chart

Kind: static method of exports
Returns: Number | module - Current width or Chart module to chain calls
Access: public

Param	Type	Default	Description
_x	Number	780	Desired width for the chart

exports~HeatmapData : Array.<Array>

Kind: inner typedef of exports
Properties

Name	Type
week	Number
day	Number
value	Number

Example

[
    {
        day: 0,
        hour: 0,
        value: 7
    },
    {
        day: 0,
        hour: 1,
        value: 10
    }
]