Maps a driver value to a color by interpolating between color stops — the gradient-style color-map, and the everyday way to author a shadow-to-light color response from a few named colors.
Declarative element:
<sk-ramp-color-map>
Global: available as sk.RampColorMap inside a scene <script>.
This is the gradient member of the ColorMap family: like every
color-map it turns a driver value in [0, 1] into a color; here it does so by
placing colors at positions along the ramp and interpolating between them.
Driven through a sk-tonemap, 0 is full shadow and 1 is full light,
so a two-stop dark-to-bright ramp reads as classic shaded lighting.
Key attributes. The colors are its sk-color-stop children, each
carrying a stop-offset (its position on the ramp), a stop-color, and the
interpolation mode for the segment that starts at it. Stops are shader
data, so changing or animating a stop's color or offset updates the ramp
without recompiling; only adding or removing stops (or attaching/detaching this
map's field) is a structural change. Up to MAX_TONEMAP_STOPS stops
render.
Related. Its stops are sk-color-stop elements. It is most often
driven by a sk-tonemap, layered inside a
sk-composite-color-map, or used as a spatial base color through a
sk-color-map-source. The dither color-maps
(sk-ordered-dither-color-map, sk-blue-noise-dither-color-map,
sk-halftone-dither-color-map) are the two-tone siblings.
constructor()Inherited from: ColorMap, SkenraAnimatable
— see those pages for inherited members.
| Property | Type | Default | Description | Declared by |
|---|---|---|---|---|
stopsread-only |
ColorRampStop[] |
[] |
Returns the current (effective, possibly animated) sorted stop list. | RampColorMap |
stopCountread-only |
number |
— | Number of stops (after the cap clamp). | RampColorMap |
fieldanimatable |
Field | null |
— | Gets the optional field that modulates this color-map's weight | ColorMap |
remapCurveanimatable |
SampledCurve | null |
— | Optional tone-response remap curve, mirroring the field family's | ColorMap |
remapCurveSourceread-only |
string | null |
— | The descriptor the curve was authored from, or null (imperative/none). |
ColorMap |
remapPhaseanimatable |
number |
0 |
Horizontal remap phase — an animatable scalar that translates the tone | ColorMap |
sceneread-only |
any |
— | Gets the Scene this animatable belongs to, if any. | SkenraAnimatable |
animationsread-only |
SkenraAnimation[] |
— | Public getter for the animations affecting this target. | SkenraAnimatable |
| Method | Description | Declared by |
|---|---|---|
solid(color: ColorInput): RampColorMap |
Creates a flat-color ramp color-map from a single color. | RampColorMap |
fromStops(stops: ColorStopInput[]): RampColorMap |
Builds a ramp color-map from a stop list by creating <sk-color-stop> |
RampColorMap |
getStopElement(i: number): ColorStop | undefined |
— | RampColorMap |
getStopColor(i: number): ColorBase | undefined |
— | RampColorMap |
setStopColor(i: number, color: Color): void |
— | RampColorMap |
getBaseStopColors(): ColorBase[] |
— | RampColorMap |
getStopOffset(i: number): number | undefined |
— | RampColorMap |
setStopOffset(i: number, offset: number): void |
— | RampColorMap |
getStopInterpolation(i: number): InterpolationMode | undefined |
— | RampColorMap |
setStopInterpolation(i: number, mode: InterpolationMode): void |
— | RampColorMap |
addStop(stop: ColorStopInput): void |
— | RampColorMap |
removeStop(i: number): void |
— | RampColorMap |
animate(firstArg: TypedKeyframe<this>[] | TypedPropertyIndexedKeyframes<this> | Record<string, any> | globalThis.Keyframe[] | globalThis.PropertyIndexedKeyframes | null, secondArg?: number | KeyframeAnimationOptions | globalThis.KeyframeAnimationOptions): SkenraAnimation & Animation |
Creates a new SkenraAnimation for this target per Web Animations API. | SkenraAnimatable |
removeAnimation(animation: SkenraAnimation): boolean |
Removes a specific animation from this object. | SkenraAnimatable |
constrain(type: K, config: ConstraintConfigMap[K]): ConstraintReturnMap[K] |
Creates a constraint on this Animatable using a fluent API. | SkenraAnimatable |