Naively Programmable Module

    @visx/heatmap
    TypeScript icon, indicating that this package has built-in type declarations

    2.1.2 • Public • Published

    @visx/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 @visx/heatmap
    

    Install

    npm i @visx/heatmap

    DownloadsWeekly Downloads

    12,312

    Version

    2.1.2

    License

    MIT

    Unpacked Size

    29.6 kB

    Total Files

    19

    Last publish

    Collaborators

    • vx-hshoff
    • hshoff
    • christopher.card.williams
    • lencioni