0.0.199 • Published 4 years ago
@vx/heatmap v0.0.199
@vx/heatmap
A Heatmap is an arrangement of shapes where the data values are represented as colors.
Example
<HeatmapRect
data={data}
xScale={xScale}
yScale={yScale}
colorScale={colorScale}
opacityScale={opacityScale}
binWidth={bWidth}
binHeight={bWidth}
step={dStep}
gap={0}
/>
Heatmaps generally require structure that has this shape:
[
{
bin: 1,
bins: [
{
count: 20,
bin: 23,
},
],
},
];
However, you're welcome to use your own structure by defining x
, y
, z
accessors such as:
// Example accessors
const x = d => d.myBin;
const y = d => d.myBins;
const z = d => d.myCount;
// Example scale with an accessors
const xScale = scaleLinear({
range: [0, xMax],
domain: extent(data, x),
});
Installation
npm install --save @vx/heatmap
0.0.199
4 years ago
0.0.198
4 years ago
0.0.197
4 years ago
0.0.196
4 years ago
0.0.195
4 years ago
0.0.194
4 years ago
0.0.193
4 years ago
0.0.193-alpha.2
4 years ago
0.0.193-alpha.1
4 years ago
0.0.193-alpha.0
4 years ago
0.0.192
5 years ago
0.0.190
5 years ago
0.0.189
5 years ago
0.0.183
5 years ago
0.0.182
5 years ago
0.0.181
5 years ago
0.0.179
6 years ago
0.0.173
6 years ago
0.0.170
6 years ago
0.0.166
6 years ago
0.0.165
6 years ago
0.0.165-beta.1
6 years ago
0.0.165-beta.0
6 years ago
0.0.161
6 years ago
0.0.153
6 years ago
0.0.143
7 years ago
0.0.140
7 years ago
0.0.136
7 years ago
0.0.127
7 years ago
0.0.126
7 years ago
0.0.125
7 years ago
0.0.120
7 years ago
0.0.116
7 years ago
0.0.115
7 years ago