require(["esri/smartMapping/raster/support/colorRamps"], (rasterColorRamps) => { /* code goes here */ });
import * as rasterColorRamps from "@arcgis/core/smartMapping/raster/support/colorRamps.js";
esri/smartMapping/raster/support/colorRamps
This module provides convenience methods for querying color ramps (arrays of colors) used for raster renderers
in the esri/smartMapping/raster/color/renderers modules.
Method Overview
| Name | Return Type | Summary | Object |
|---|---|---|---|
Returns all color ramps designed for raster renderers, each as an array of colors. | colorRamps | ||
Returns the color ramp matching the given name. | colorRamps | ||
Creates a raster color ramp from a list of colors. | colorRamps | ||
Returns a raster color ramp's name. | colorRamps | ||
Returns the names of all raster color ramps. | colorRamps |
Method Details
-
Returns all color ramps designed for raster renderers, each as an array of colors.
ReturnsExamples// returns all raster color ramps available in the JS API const ramps = colorRamps.all();// Renders all color ramps as continuous color ramps in the body of the html const ramps = colorRamps.all(); ramps.forEach( ramp => { const colorRamp = symbolUtils.renderColorRampPreviewHTML(ramp.colors, { align: "horizontal" }); body.appendChild(colorRamp); });
-
byName
MethodbyName(name){ColorRamp} -
Returns the color ramp matching the given name.
Parametername StringThe name of the desired color ramp.
ReturnsType Description ColorRamp The color ramp matching the given name. - See also
Example// returns the colors of the Elevation #1 color ramp const elevationRamp = colorRamps.byName("Elevation #1"); const colorRampElement = symbolUtils.renderColorRampPreviewHTML(elevationRamp.colors, { align: "horizontal" }); body.appendChild(colorRampElement);
-
createColorRamp
MethodcreateColorRamp(options){MultipartColorRamp |AlgorithmicColorRamp} -
Creates a raster color ramp from a list of colors.
ParametersSpecificationoptionsOptions for creating a raster color ramp with the following properties:
SpecificationAn array of colors to convert to a multi-part or algorithmic color ramp.
algorithm StringoptionalDefault Value: cie-labThe algorithm used to interpolate colors between stops.
Possible Value Description cie-lab Blends the from and to colors without traversing the intervening hue space. lab-lch The hue, saturation, value (hsv) algorithm is a linear traverse of colors between pairs: Color 1 H to Color 2 H, Color 1 S to Color 2 S, and Color 1 V to Color 2 V. hsv The lab-lch algorithm is very similar to the cie-lab but does not seek the shortest path between colors. Possible Values:"cie-lab"|"lab-lch"|"hsv"
ReturnsType Description MultipartColorRamp | AlgorithmicColorRamp Returns the raster color ramp given an input array of colors.
-
getColorRampName
MethodgetColorRampName(colorRamp){ColorRampName} -
Returns a raster color ramp's name.
ParametercolorRamp MultipartColorRamp|AlgorithmicColorRampThe raster color ramp from which to get the name.
ReturnsType Description ColorRampName Returns the color ramp name and whether it is inverted.
-
Returns the names of all raster color ramps.
ReturnsExample// returns all color ramp names available in the JS API const rampNames = colorRamps.names();
Type Definitions
-
Defines a ramp of colors to use for visualizing raster data.