Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of API Heatmap - brand colors round 20 steps

Public visualization

Viewing a saved revision (read-only)

0fe9dba753064e4b887298b6a9f66ce0

Fork of API Heatmap - brand colors round 20 steps

0 stars0🌍 Public
MMark Lam
Last edited Mar 10, 2022
Created on Mar 10, 2022

This example uses a linked dataset of company descriptions and relative scores to create a 20-step heatmap grid. Rendering as a flexible HTML/CSS grid, each of the 20 cells is colored by a three-color gradient from light gray to dark teal, based on the company's relative score rounded to the nearest half. The visualization includes interactive tooltips, a mouse-following indicator, and a details panel that appears on click, showing company information like industry and a link to its Nasdaq page. The chart uses D3's `scaleLinear` for color mapping and `json()` for data loading.

AI-generated description

The color uses a continuous color scale rounding to the nearest .2 resulting 50 bins.

The color scale is a 3 color gradient with 5 being gray, allowing for a smoother transition.