HeatMap HTTP API

POST /charts/heatmap
svgcanvashttp api

The HeatMapcomponent is available in the nivo HTTP rendering API. The API generates a SVG and return a path to this SVG which can then be easily embedded.

The api accepts almost the same properties as the regular component, in json, however it's not interactive and you cannot use code in properties (functions).

Please note that the demo API server is installed on heroku using a free plan, so it might be unavailable from times to times.

Click the generate button in order to generate the chart.
You can customize settings by using dedicated controls.
generate
Response n/a
no response available
Base
HeatMapSerie<Datum, ExtraProps>[]required

Chart data.

string | (value: number) => string | numberoptional
open editor

Optional formatter for values.

numberrequired
px

Chart width for non-responsive component.

numberoptional

Chart default width for responsive component.

numberrequired
px

Chart height for non-responsive component.

numberoptional

Chart default height for responsive component.

number (ms)optional

Debounce width/height updates for responsive component.

(dimensions: { width: number; height: number }) => voidoptional

A callback for when responsive component is resized.

numberoptionaldefault:'Depends on device'

Adjust pixel ratio, useful for HiDPI screens.

supportsvgcanvasapi
objectoptional
px
px
px
px

Chart margin.

booleanoptionaldefault:false
   

Force square cells (width = height), please note that padding is ignored.

numberoptionaldefault:0
numberoptionaldefault:0
numberoptionaldefault:0
numberoptionaldefault:0
false | SizeVariationConfigoptionaldefault:false

Optionally make the size of the cells vary depending on their value.

Ref<SVGSVGElement | HTMLCanvasElement>optional

Ref to the chart's container. Used on this page to generate/download the chart's image via html-to-image.

supportsvgcanvasapi
Style
Labels
Grid & Axes
Legends
Customization
Interactivity
Annotations
Accessibility
Motion