From be20633945c5256b51791e9a8ec9d8e1ce08c45e Mon Sep 17 00:00:00 2001 From: nym21 Date: Mon, 1 Jun 2026 18:03:41 +0200 Subject: [PATCH] heatmaps: part 23 --- website/src/heatmap/format.js | 17 ++++++++++ website/src/heatmap/lut.js | 60 ----------------------------------- website/src/heatmap/oracle.js | 19 +---------- website/src/heatmap/urpd.js | 21 ++---------- 4 files changed, 20 insertions(+), 97 deletions(-) create mode 100644 website/src/heatmap/format.js diff --git a/website/src/heatmap/format.js b/website/src/heatmap/format.js new file mode 100644 index 000000000..4227f87c9 --- /dev/null +++ b/website/src/heatmap/format.js @@ -0,0 +1,17 @@ +/** @param {number} value */ +export function formatCompact(value) { + if (value >= 1000) return `${formatNumber(value / 1000)}k`; + return formatNumber(value); +} + +/** @param {number} value */ +function formatNumber(value) { + if (value >= 100) return String(Math.round(value)); + if (value >= 10) return trimNumber(value.toFixed(1)); + return trimNumber(value.toFixed(2)); +} + +/** @param {string} value */ +function trimNumber(value) { + return value.replace(/\.?0+$/, ""); +} diff --git a/website/src/heatmap/lut.js b/website/src/heatmap/lut.js index c878590c1..32a380bb0 100644 --- a/website/src/heatmap/lut.js +++ b/website/src/heatmap/lut.js @@ -31,18 +31,6 @@ const DIVERGING_POSITIVE_STOPS = [ export const DIVERGING_NEGATIVE_LUT = createColorLut(DIVERGING_NEGATIVE_STOPS); export const DIVERGING_POSITIVE_LUT = createColorLut(DIVERGING_POSITIVE_STOPS); -/** - * @param {ArrayLike} lut - * @returns {HeatmapColorFn} - */ -export function intensityColor(lut) { - return (value) => { - if (!Number.isFinite(value)) return 0x00000000; - const index = Math.min(255, Math.max(0, Math.round(value * 255))); - return lut[index] ?? 0x00000000; - }; -} - /** * @param {ArrayLike} lut * @returns {HeatmapColorFn} @@ -58,21 +46,6 @@ export function logIntensityColor(lut) { }; } -/** - * @param {ArrayLike} lut - * @returns {HeatmapColorFn} - */ -export function linearIntensityColor(lut) { - return (value, context) => { - if (!Number.isFinite(value) || value <= 0) return 0x00000000; - const cap = context.grid.getMaxValue(context.col); - if (cap <= 0) return 0x00000000; - const t = Math.min(1, value / cap); - const index = Math.min(255, Math.max(0, Math.round(t * 255))); - return lut[index] ?? 0x00000000; - }; -} - /** * @param {ArrayLike} lut * @param {number} [exponent] @@ -111,39 +84,6 @@ export function divergingPowerIntensityColor( }; } -/** - * @param {ArrayLike} lut - * @param {{ knee?: number, max?: number }} [options] - * @returns {HeatmapColorFn} - */ -export function softIntensityColor(lut, { knee = 0.15, max = 1 } = {}) { - return (value, context) => { - if (!Number.isFinite(value) || value <= 0) return 0x00000000; - const cap = context.grid.getMaxValue(context.col); - if (cap <= 0) return 0x00000000; - const ratio = Math.min(1, value / cap); - const t = (ratio / (ratio + knee)) * max; - const index = Math.min(255, Math.max(0, Math.round(t * 255))); - return lut[index] ?? 0x00000000; - }; -} - -/** - * @param {ArrayLike} lut - * @returns {HeatmapColorFn} - */ -export function smoothLogIntensityColor(lut) { - return (value, context) => { - if (!Number.isFinite(value) || value <= 0) return 0x00000000; - const cap = context.grid.getMaxValue(context.col); - if (cap <= 0) return 0x00000000; - const u = Math.log1p(value) / Math.log1p(cap); - const t = u * u * (3 - 2 * u); - const index = Math.min(255, Math.max(0, Math.round(t * 255))); - return lut[index] ?? 0x00000000; - }; -} - /** * @param {number[][]} stops - Tuples of [position, red, green, blue]. */ diff --git a/website/src/heatmap/oracle.js b/website/src/heatmap/oracle.js index 25974416a..571004347 100644 --- a/website/src/heatmap/oracle.js +++ b/website/src/heatmap/oracle.js @@ -1,4 +1,5 @@ import { brk } from "../../scripts/utils/client.js"; +import { formatCompact } from "./format.js"; import { createAverageGrid } from "./grid.js"; import { INFERNO_LUT, logIntensityColor } from "./lut.js"; import { defaultTooltip } from "./tooltip/index.js"; @@ -137,21 +138,3 @@ function formatAmount(value) { if (btc >= 1) return `${formatCompact(btc)} BTC`; return `${formatCompact(btc * 100_000_000)} sats`; } - -/** @param {number} value */ -function formatCompact(value) { - if (value >= 1000) return `${formatNumber(value / 1000)}k`; - return formatNumber(value); -} - -/** @param {number} value */ -function formatNumber(value) { - if (value >= 100) return String(Math.round(value)); - if (value >= 10) return trimNumber(value.toFixed(1)); - return trimNumber(value.toFixed(2)); -} - -/** @param {string} value */ -function trimNumber(value) { - return value.replace(/\.?0+$/, ""); -} diff --git a/website/src/heatmap/urpd.js b/website/src/heatmap/urpd.js index f175b3396..4bf1d22cd 100644 --- a/website/src/heatmap/urpd.js +++ b/website/src/heatmap/urpd.js @@ -1,5 +1,6 @@ import { brk } from "../../scripts/utils/client.js"; import { numberToShortUSFormat } from "../../scripts/utils/format.js"; +import { formatCompact } from "./format.js"; import { createAverageGrid } from "./grid.js"; import { DIVERGING_NEGATIVE_LUT, @@ -175,6 +176,7 @@ function createUrpdHeatmapOption({ grid: createAverageGrid({ yMin: MIN_LOG, yMax: MAX_LOG, + minCellSize: 2, }), color, axis: { @@ -207,7 +209,6 @@ async function fetchUrpdPoints(cohort, date, signal, getValue, onPoints) { let points; const urpd = await brk.getUrpdAt(cohort, date, AGGREGATION, { signal, - cache: false, onValue: onPoints ? (urpd) => { points = toPoints(urpd, getValue); @@ -277,21 +278,3 @@ function formatSignedDollar(value) { if (value < 0) return `-${formatted}`; return formatted; } - -/** @param {number} value */ -function formatCompact(value) { - if (value >= 1000) return `${formatNumber(value / 1000)}k`; - return formatNumber(value); -} - -/** @param {number} value */ -function formatNumber(value) { - if (value >= 100) return String(Math.round(value)); - if (value >= 10) return trimNumber(value.toFixed(1)); - return trimNumber(value.toFixed(2)); -} - -/** @param {string} value */ -function trimNumber(value) { - return value.replace(/\.?0+$/, ""); -}