Product media placeholder
Replace this area with a screenshot or short walkthrough video during the media sweep.
Continuous float-to-string mapping over a single threshold. Emits `above` when input ≥ threshold, `below` otherwise — every frame, not just on crossing. Replaces the 2-node `expression(node('p') > X ? 1 : 0) → stringArrayPick { values: [below, above] }` pattern that recurs whenever a latched CSS property (`pointer-events`, `display`, `visibility`, `cursor`) needs to flip on/off based on a scalar driver. Distinct from `thresholdPulse`, which fires a one-shot pulse on crossing and is meant for event consumers.
Type thresholdMapCategory mathContext sharedDynamic ports noCompound no
Inputs
| Port | Type | Description |
|---|---|---|
value | float | Value |
threshold | float | Threshold (override) |
Outputs
| Port | Type | Description |
|---|---|---|
result | string | Result |
Parameters
| Parameter | Type | Default | Description |
|---|---|---|---|
threshold | float | 0.5 | Default threshold value. The `threshold` input port (when wired) overrides this per frame so a viewport-derived or animated threshold re-evaluates without a graph rewrite. step 0.01 |
below | string | "" | Output string when value < threshold (or ≤ when strict). Empty string is fine — common for clearing a CSS property by writing `''`. |
above | string | "" | Output string when value ≥ threshold (or > when strict). |
strict | bool | false | When true, uses strict `>` comparison; when false (default), uses inclusive `≥`. Inclusive matches the intuition that "exactly at threshold" should already be on. |
Use cases
- Drawer / modal pointer-events gate — `pointer-events: none` while the open progress is below 5%, `auto` once it crosses, so clicks during a partial open don't hit the half-revealed surface.
- Toggle `display: none` on a scroll-driven section once its progress passes 0 — without the typical "expression returns 0/1, then a pick" two-node chain.
- Cursor / accessibility hints that flip at a specific scrub value (`grab` ↔ `grabbing`).
Related nodes
Envelope
Use thresholdMap as the node type inside a graph node envelope. Add id, optional params, optional connections, and optional activeWhen based on the guide context.
Generated source
Registry faster-motion-docs/node-registry.jsonCategory page /help/faster-motion/faster-motion-node-category-math/