heatmap-values

Generate heatmap with RGBA from pre-built or custom color scheme.

Designed for class activation map of image classifier AI model visualization.

Features

• Multiple built-in color schemes:
  • red-green-blue
  • red-transparent-blue
  • hot-only
  • cold-only
• Support custom color scheme
• Typescript support
• Isomorphic package: works in Node.js and browsers

Installation

npm install heatmap-values

You can also install heatmap-values with pnpm, yarn, or slnpm

Usage Example

import { generate_heatmap_values, heatmap_schemes } from 'heatmap-values'

let values = generate_heatmap_values(heatmap_schemes.red_transparent_blue)

for (let i = 0; i < 256; i++) {
  let [r, g, b, a] = values[i]
  let color = `rgba(${r},${g},${b},${a})`
  console.log(i / 255, color)
}

Detail usage example see demo.ts and demo.html.

Typescript Signature

export function generate_heatmap_values(
  /** @description default is red_transparent_blue */
  scheme?: HeatmapScheme,
): RGBA[]

export type HeatmapScheme = {
  low: RGBA
  middle: RGBA
  high: RGBA
}

export type RGBA = [
  /** @description 0..255 */
  r: number,
  /** @description 0..255 */
  g: number,
  /** @description 0..255 */
  b: number,
  /** @description 0..1 */
  a: number,
]

export const heatmap_schemes: {
  red_green_blue: HeatmapScheme
  red_transparent_blue: HeatmapScheme
  hot_only: HeatmapScheme
  cold_only: HeatmapScheme
}

License

This project is licensed with BSD-2-Clause

This is free, libre, and open-source software. It comes down to four essential freedoms [ref]:

• The freedom to run the program as you wish, for any purpose
• The freedom to study how the program works, and change it so it does your computing as you wish
• The freedom to redistribute copies so you can help others
• The freedom to distribute copies of your modified versions to others