require(["esri/smartMapping/symbology/flow"], (flowSchemes) => { /* code goes here */ });
import * as flowSchemes from "@arcgis/core/smartMapping/symbology/flow.js";
esri/smartMapping/symbology/flow
Object containing helper methods for generating optimal settings for FlowRenderer. The getSchemes() method is used to generate renderer properties best suited to the basemap and theme.
- See also
Method Overview
| Name | Return Type | Summary | Object |
|---|---|---|---|
Clones a flow scheme object. | flow | ||
Returns the flow scheme with the given name. | flow | ||
Returns a primary scheme and secondary schemes defining properties for flow visualizations in a ImageryLayer and ImageryTileLayer. | flow | ||
Returns the flow schemes filtered by tags included and excluded from the paramters. | flow | ||
Returns metadata for the available themes. | flow |
Method Details
-
cloneScheme
MethodcloneScheme(scheme){FlowScheme} -
Clones a flow scheme object.
Parameterscheme FlowSchemeThe flow scheme object to clone.
ReturnsType Description FlowScheme Returns a clone of the given color scheme object. Example// clones the primary scheme returned from the getSchemes() method let flowScheme = primaryScheme.clone();
-
getSchemeByName
MethodgetSchemeByName(params){FlowScheme} -
Returns the flow scheme with the given name.
ParametersSpecificationparams ObjectSee the table below for details of each parameter that may be passed to this function.
Specificationname StringThe name of the desired scheme.
theme StringoptionalDefault Value: "flow-line"Determines how flow lines will render. Possible values are listed below.
Value Description Example flow-line Renders the uv and magnitude data as animated flow lines. This is ideal for representing wind and other atmospheric data. 
wave-front Renders UV and magnitude data in a wave-like animation. This theme works well for ocean data. 
Possible Values:"flow-line"|"wave-front"
optional The Esri basemap to pair with the visualization. This value indicates the best colors for visualizing flow lines against the given basemap. If you have a non-Esri basemap (e.g. a VectorTileLayer basemap with a custom style) or no basemap at all, then use the
basemapThemeparameter instead of this parameter.basemapTheme StringoptionalIf you have a non-Esri basemap (e.g. a VectorTileLayer basemap with a custom style) or no basemap at all, use this parameter to indicate whether the background of the visualization is
lightordark.Possible Values:"light"|"dark"
ReturnsType Description FlowScheme Returns the scheme matching the given name. Example// Constructs the scheme using the Perfect Pigtails color ramp. const schemes = flowSchemes.getSchemeByName({ name: "Perfect Pigtails", basemapTheme: "dark", theme: "wave-front" });
-
getSchemes
MethodgetSchemes(params){FlowSchemes} -
Returns a primary scheme and secondary schemes defining properties for flow visualizations in a ImageryLayer and ImageryTileLayer. The
basemapparameter determines the appropriate color schemes used to visualize flow lines.ParametersSpecificationparams ObjectSee the table below for details of each parameter that may be passed to this function.
Specificationtheme StringoptionalDefault Value: "flow-line"Determines how flow lines will render. Possible values are listed below.
Value Description Example flow-line Renders the uv and magnitude data as animated flow lines. This is ideal for representing wind and other atmospheric data. wave-front Renders UV and magnitude data in a wave-like animation. This theme works well for ocean data. Possible Values:"flow-line"|"wave-front"
optional The Esri basemap to pair with the visualization. This value indicates the best colors for visualizing flow lines against the given basemap. If you have a non-Esri basemap (e.g. a VectorTileLayer basemap with a custom style) or no basemap at all, then use the
basemapThemeparameter instead of this parameter.basemapTheme StringoptionalIf you have a non-Esri basemap (e.g. a VectorTileLayer basemap with a custom style) or no basemap at all, use this parameter to indicate whether the background of the visualization is
lightordark.Possible Values:"light"|"dark"
ReturnsType Description FlowSchemes Returns an object containing the primary flow scheme to use for the given basemap. Secondary schemes are also provided. Example// gets the primary scheme for the features of the given geometry type and basemap const schemes = flowSchemes.getSchemes({ basemapTheme: "dark", theme: "wave-front" }); // the suggested default scheme for the layer, basemap, and theme let primaryScheme = schemes.primaryScheme;
-
getSchemesByTag
MethodgetSchemesByTag(params){FlowScheme[]} -
Returns the flow schemes filtered by tags included and excluded from the paramters.
ParametersSpecificationparams ObjectSee the table below for details of each parameter that may be passed to this function.
Specificationoptional When provided, only schemes containing all the matching tags will be returned.
Known Tags: light | dark | reds | yellows | oranges | greens | blues | purples | pinks | browns | grays | bright | subdued | colorblind-friendly | diverging | sequential | 3d
optional When provided, only schemes excluding all the provided tags will be returned.
Known Tags: light | dark | reds | yellows | oranges | greens | blues | purples | pinks | browns | grays | bright | subdued | colorblind-friendly | diverging | sequential | 3d
theme StringoptionalDefault Value: "flow-line"Determines how flow lines will render. Possible values are listed below.
Value Description Example flow-line Renders the uv and magnitude data as animated flow lines. This is ideal for representing wind and other atmospheric data. wave-front Renders UV and magnitude data in a wave-like animation. This theme works well for ocean data. Possible Values:"flow-line"|"wave-front"
optional The Esri basemap to pair with the visualization. This value indicates the best colors for visualizing flow lines against the given basemap. If you have a non-Esri basemap (e.g. a VectorTileLayer basemap with a custom style) or no basemap at all, then use the
basemapThemeparameter instead of this parameter.basemapTheme StringoptionalIf you have a non-Esri basemap (e.g. a VectorTileLayer basemap with a custom style) or no basemap at all, use this parameter to indicate whether the background of the visualization is
lightordark.Possible Values:"light"|"dark"
ReturnsType Description FlowScheme[] Returns an array of flow schemes with the given tags included in the search and excluding the given tags excluded from the search. Example// returns colorblind friendly red color schemes const schemes = flowSchemes.getSchemesByTag({ basemapTheme: "dark", theme: "wave-front", includedTags: [ "reds", "colorblind-friendly" ] });
-
Returns metadata for the available themes. If a basemap is provided, returns themes that work best with the given basemap.
Parameteroptional The Esri basemap string or basemap object that will be used with the returned theme(s).
Returns
Type Definitions
-
Suggested property values for defining the scheme used to visualize flow lines.
- Properties
-
name String
The unique name of the scheme.
Tags associated with the scheme.
id StringThe unique id of the color scheme to use in the visualization. The id is assigned based on the following template:
<themeName>/<basemapName>/<schemeName>.theme StringDetermines how flow lines will render. Possible values are listed below.
Value Description Example flow-line Renders the uv and magnitude data as animated flow lines. This is ideal for representing wind and other atmospheric data. wave-front Renders UV and magnitude data in a wave-like animation. This theme works well for ocean data. Possible Values:"flow-line"|"wave-front"
color ColorThe suggested color of the flow lines if a color visual variable is not desired.
The suggested colors to use if a ColorVariable is set on the flow renderer.
density NumberThe suggested density of the stream lines.
flowSpeed NumberThe suggested flowSpeed of the stream lines.
trailLength NumberThe suggested length of the stream lines.
trailWidth NumberThe suggested width of the stream lines.
trailCap NumberThe suggested cap style of the stream lines.
layerEffect StringThe suggested effect to apply to the input layer.
minWidth NumberThe suggested size to apply to small magnitude values if a SizeVariable is set on the flow renderer.
maxWidth NumberThe suggested size to apply to large magnitude values if a SizeVariable is set on the flow renderer.
minOpacity NumberThe suggested opacity to apply to small magnitude values if an OpacityVariable is set on the flow renderer.
maxOpacity NumberThe suggested opacity to apply to large magnitude values if an OpacityVariable is set on the flow renderer.
-
The return object of the getSchemes() method.
- Properties
-
primaryScheme FlowScheme
The flow scheme best suited for the given basemap.
secondarySchemes FlowScheme[]Additional flow schemes that may be used to visualize stream lines overlaid on the given basemap or basemap theme.
basemapId StringThe ID of the basemap associated with the given schemes.
basemapTheme StringIndicates whether the average basemap color is
lightordark.
-
Describes a theme that pairs well with the given basemaps. See the table below for more details of the properties in this object.