API Heatmap - brand colors round 10 steps - reusable

API Heatmap - brand colors round .2

This heatmap visualizes brand-related data for 20 companies, using a 3-color continuous scale from d3.scaleLinear that pivots at a value of 5 and rounds scores to 0.2 increments, creating 10 distinct color bands. Each SVG rectangle represents a company, colored by its relative score, with the ticker symbol and score overlaid. The code uses d3.json to load data from a NASDAQ-linked gist, d3.scaleLinear for color mapping, and d3.mouse for tooltip interactions. A color legend at the bottom displays the full gradient range from 0 to 10.

API Heatmap - brand colors round .2 3band rgg - 20

A grid of 20 company symbols forms an API heatmap, with each cell colored by a relatedness score. The visualization uses a three-band red-gray-green linear scale, mapping scores from 0 to 10 with values rounded to the nearest 0.2, creating 50 distinct bins. d3.scaleLinear assigns fill colors, while d3.json loads the data. Tooltips display company details on hover, and a legend shows the color scale's gradient.

API Heatmap - brand colors round 20 steps

This visualization displays an API heatmap of 20 companies, each represented by a tile showing a ticker symbol and relevance score. The code uses a d3.scaleLinear color scale with a three-color gradient from gray to teal to dark green, rounded to 0.5 increments. Tiles are rendered as SVG rectangles with mouseover tooltips showing company details, while a legend indicates the vector score range from 0 to 10. The data comes from a remote JSON file containing company symbols and metadata from the ms_industry dataset.

API Heatmap - brand colors

This visualization displays a grid of company squares, each colored by a relevance score using a linear color scale from light gray to dark teal. The heatmap uses D3 v7 to render SVG rectangles and text labels for company symbols and scores. Data is loaded as JSON from a GitHub gist, and interactive tooltips show company details like industry and description on mouseover. A color legend along the bottom maps the VectorScore range from 0 to 10.

API Heatmap - brand colors floor extent rounded

An interactive heatmap displays brand-relation scores for 20 companies in a 5x4 grid, using a diverging color scale to map minimum, midpoint, and maximum scores. The scale floors relation scores into 10 perceptible color steps, enabling easy comparison within the basket. D3 v7 handles SVG rendering, tooltips on hover, and click interactions showing company details. Data comes from a JSON file containing company names, industries, descriptions, and relation scores, with a linear color scale mapping values to muted teal and gray tones.

91% match

API Heatmap - brand colors floor extent

This visualization displays a 5-by-4 grid heatmap of stock symbols, where each cell’s color encodes a relation score between a company and a selected brand. The fill uses d3.scaleLinear with a three-stop domain mapping to a two-color range, while a separate scaleLinear floors scores into ten discrete legend steps. It renders as SVG using d3.v7, with tooltips and a side panel showing company details on hover.

91% match

Fork of API Heatmap - brand colors round 30 steps

This example displays a grid of company tiles colored by a relative score, with a gradient legend below. The color scale uses a continuous three-color gradient from gray to teal, rounded to 30 steps. Squares are arranged in five columns, each showing a company symbol and its score. Tooltips reveal company details on hover. The visualization uses d3.scaleLinear for color mapping, d3.json to load the data, and SVG rectangles to render the heatmap cells.

90% match

Fork of API Heatmap - brand colors round 20 steps

A responsive SVG heatmap displays companies from the GME-20 dataset, each rendered as a colored square labeled with a ticker symbol and a relative score. A three-stop linear color scale (`d3.scaleLinear`) transitions from light gray through teal to dark green, with continuous values rounded to the nearest 0.5 via `Math.ceil`, producing 50 discrete bins. Tooltips show company details on mouseover. The code imports specific functions from D3 v7, including `json`, `scaleLinear`, and `format`, and uses an API-hosted JSON file as the data source, positioning elements with a custom grid layout.