The layer is the most fundamental component of a Map. It is a collection of spatial data in the form of vector graphics or raster images that represent real-world phenomena. Layers may contain discrete features that store vector data or continuous cells/pixels that store raster data.
In the case of vector-based layers, such as FeatureLayer and GraphicsLayer, each feature contained in the layer has a Geometry that allows it to be rendered as a Graphic with spatial context on the view. Features within the layer also contain data attributes that provide additional information, which may be viewed in popup windows and used for rendering the layer.
To create a layer you must use one of the subclasses of Layer or call the Layer.fromPortalItem() method. A few examples of layers include the following:
- Roads and highways may be represented using linear features in a FeatureLayer
- Land parcels can be displayed as polygons in a MapImageLayer
- Satellite imagery may be displayed as tiled images in a TileLayer
Multiple layers may be added to the same map and overlaid on top of one another for visualization and analytical purposes. See Map for additional information regarding how to add layers to a map. Layers are rendered in the View with a LayerView.
In a broad sense, layers can be used for the following purposes:
- Displaying location for geographic context
- Querying data
- Displaying categorical and/or numeric data
- Analytics
All layer types inherit from Layer. To learn more about each layer type, comparing and contrasting their data sources and capabilities, see the table below.
Layers for quering, visualizing, analyzing data
Layer type | Data source | Data types | Features | Limitations |
---|---|---|---|---|
FeatureLayer | ArcGIS FeatureServer/MapServer, ArcGIS Portal item, or client-side graphics | Points, polylines, polygons downloaded as vector graphics | Client-side processing, popup templates, renderers with 2D and 3D symbols, querying, editing (in a future release) | Limited number of features for display; may require large download depending on number of features |
GraphicsLayer | Client-side graphics | Points, polylines, polygons displayed as vector graphics | No geometry schema. Points, polylines and polygons may be stored in a single layer. | No renderer nor popup templates; visualization and popup templates are handled on a graphic-by-graphic basis. |
MapImageLayer | ArcGIS MapServer, ArcGIS Portal item | Points, polylines, polygons, rasters exported in a single image | May contain nested sublayers. Server-side processing of renderers, popup templates, opacity, and labels for fast display of many features. May be used to display, query, and join data in registered workspaces | No editing support |
SceneLayer | ArcGIS SceneServer, ArcGIS Portal item | Point and multipatch geometries | Can display a large number of features on the client. Ideal for rendering 3D features | No 2D support; no editing |
CSVLayer | CSV file | Points downloaded as vector graphics | Client-side processing, popup templates, renderers with 2D and 3D symbols | May require large download depending on the number of features |
StreamLayer | ArcGIS StreamServer | Points downloaded as vector graphics | Downloads and updates feature locations in real time | n/a |
ImageryLayer | ArcGIS ImageServer, ArcGIS Portal item | Raster data exported as a single image | Client-side and server-side pixel filtering and rendering; popup templates; querying | n/a |
GeoRSSLayer | GeoRSS feed | Points, polylines, polygons | No geometry schema; popup templates | No 3D support; no support for renderers |
MapNotesLayer | ArcGIS Portal item | Points, polylines, polygons, text | Map Notes in a webmap | No 3D support; read-only |
WMSLayer | WMS service, ArcGIS Portal item | Data exported as a single image | OGC specification | No 3D support |
Layers for providing geographic context
Layer type | Data source | Data types | Features | Limitations |
---|---|---|---|---|
TileLayer | ArcGIS MapServer, ArcGIS Portal item | Image tiles | Better performance for large datasets; querying features | No editing, client-side rendering, or popup templates; some schema limitations in 3D views. |
VectorTileLayer | ArcGIS Portal item | Points, polylines, and polygons rendered as vector tiles | Features may be styled client-side and used as a tiled basemap | No editing, client-side rendering, or popup templates. |
IntegratedMeshLayer | ArcGIS SceneServer, ArcGIS Portal item | Point cloud mesh integrated with imagery | Displays 3D objects with a high level of detail | No 2D support |
ElevationLayer | ArcGIS ImageServer, ArcGIS Portal item | Tiled elevation mesh/surface | Renders elevation surfaces in 3D views | No 2D support |
PointCloudLayer | ArcGIS SceneServer, ArcGIS Portal item | Point clouds (e.g. collected from LiDAR) | Renderers; fast display of point clouds | No 2D support |
OpenStreetMapLayer | OpenStreetMap tile services | Image tiles | Displays OpenStreetMap tiled content | n/a |
WMTSLayer | WMTS tile services, ArcGIS Portal item | Image tiles | OGC specification | No 3D support |
WebTileLayer | non-ArcGIS, non-OGC, and non-OSM tile services | Image tiles | n/a | No editing, client-side rendering, or popup templates. |
Other layers
Layer type | Data source | Data types | Features | Limitations |
---|---|---|---|---|
GroupLayer | Any combination of other layer types | n/a | Combines two or more layers into a single layer | n/a |
An instance of any layer is also a Promise. This allows you to execute code once the promise resolves, or when the layer finishes loading its resources. See then() for additional details.
Property Overview
Name | Type | Summary | |
---|---|---|---|
String | The name of the class. more details | more details | |
Extent | The full extent of the layer. more details | more details | |
String | The unique ID assigned to the layer. more details | more details | |
String | Indicates how the layer should display in the LayerList widget. more details | more details | |
Boolean | Indicates whether the layer's resources have loaded. more details | more details | |
Error | The Error object returned if an error occurred while loading. more details | more details | |
String | Represents the status of a load operation. more details | more details | |
Object[] | A list of warnings which occurred while loading. more details | more details | |
Number | The opacity of the layer. more details | more details | |
String | The title of the layer used to identify it in places such as the Legend and LayerList widgets. more details | more details | |
String | The layer type provides a convenient way to check the type of the layer without the need to import specific layer modules. more details | more details | |
Boolean | Indicates if the layer is visible in the View. more details | more details |
Property Details
declaredClassStringreadonly
The name of the class. The declared class name is formatted as
esri.folder.className
.The full extent of the layer. By default, this is worldwide. This property may be used to set the extent of the view to match a layer's extent so that its features appear to fill the view. See the sample snippet below.
Example:// Once the layer loads, set the view's extent to the layer's fullextent layer.then(function(){ view.extent = layer.fullExtent; });
idString
The unique ID assigned to the layer. If not set by the developer, it is automatically generated when the layer is loaded.
listModeString
Indicates how the layer should display in the LayerList widget. The known values are listed below.
Value Description show The layer is visible in the table of contents. hide The layer is hidden in the table of contents. hide-children If the layer is a GroupLayer, hide the children layers from the table of contents. Default Value: showloadedBooleanreadonly
Indicates whether the layer's resources have loaded. When
true
, all the properties of the object can be accessed.Default Value: falseloadErrorErrorreadonly
The Error object returned if an error occurred while loading.
Default Value: nullloadStatusStringreadonly
Represents the status of a load operation.
Value Description not-loaded The object's resources have not loaded. loading The object's resources are currently loading. loaded The object's resources have loaded without errors. failed The object's resources failed to load. See loadError for more details. Default Value: not-loadedloadWarningsObject[]readonly
A list of warnings which occurred while loading.
opacityNumber
The opacity of the layer. This value can range between
1
and0
, where0
is 100 percent transparent and1
is completely opaque.Default Value: 1Example:// Makes the layer 50% transparent layer.opacity = 0.5;
titleString
typeStringreadonly
The layer type provides a convenient way to check the type of the layer without the need to import specific layer modules.
Possible values: base-dynamic | base-elevation | base-tile | elevation | feature | graphics | group | imagery | integrated-mesh | map-image | open-street-map | point-cloud | scene | stream | tile | unknown | unsupported | vector-tile | web-tile
visibleBoolean
Indicates if the layer is visible in the View. When
false
, the layer may still be added to a Map instance that is referenced in a view, but its features will not be visible in the view.Default Value: trueExample:// The layer is no longer visible in the view layer.visible = false;
Method Overview
Name | Return Type | Summary | |
---|---|---|---|
Promise | An instance of this class is a Promise. more details | more details | |
Cancels a load() operation if it is already in progress. more details | more details | ||
Promise | Fetches custom attribution data for the layer when it becomes available. more details | more details | |
Promise | Creates a new layer instance from an ArcGIS Server URL. more details | more details | |
Promise | Creates a new layer instance of the appropriate layer class from an ArcGIS Online or ArcGIS for Portal portal item. more details | more details | |
Boolean | Indicates whether there is an event listener on the instance that matches the provided event name. more details | more details | |
Boolean | An instance of this class is a Promise. more details | more details | |
Boolean | An instance of this class is a Promise. more details | more details | |
Boolean | An instance of this class is a Promise. more details | more details | |
Promise | Loads the resources referenced by this class. more details | more details | |
Object | Registers an event handler on the instance. more details | more details | |
Promise | An instance of this class is a Promise. more details | more details | |
Promise | An instance of this class is a Promise. more details | more details |
Method Details
always(callbackOrErrback){Promise}
An instance of this class is a Promise. Therefore
always()
may be used to execute a function if the promise is rejected or resolved. The input function will always execute no matter the response. For more information about promises, see the Working with Promises guide page.Parameter:optionalcallbackOrErrback FunctionThe function to execute when the promise is rejected or resolved.
Returns:Type Description Promise Returns a new promise for the result of callbackOrErrback
.Example:// Although this example uses MapView, any class instance that is a promise may use always() in the same way var view = new MapView(); view.always(function(){ // This function will always execute whether or not the promise is resolved or rejected });
cancelLoad()
Cancels a load() operation if it is already in progress.
fetchAttributionData(){Promise}
Fetches custom attribution data for the layer when it becomes available.
Returns:Type Description Promise Resolves to an object containing custom attribution data for the layer. fromArcGISServerUrl(params){Promise}static
Creates a new layer instance from an ArcGIS Server URL. Depending on the URL, the returned layer type may be a FeatureLayer, TileLayer, MapImageLayer, SceneLayer, StreamLayer, ElevationLayer or GroupLayer.
This is useful when you work with various ArcGIS Server URLs, but you don't necessarily know which layer type(s) they create. This method creates the appropriate layer type for you. In case of a feature service or a scene service, when the URL points to the service and the service has multiple layers, the returned promise will resolve to a GroupLayer.
Parameters:params ObjectInput parameters for creating the layer.
Specification:url StringThe ArcGIS Server URL used to create the layer.
optionalproperties ObjectSet any of the layer's properties here for constructing the layer instance (e.g. popupTemplate, renderer, etc.).
Returns:Type Description Promise Returns a promise that resolves to the new Layer instance. Example:// get an ArcGIS server url from a custom function var arcgisUrl = getLayerUrl(); Layer.fromArcGISServerUrl({ url: arcgisUrl, properties: { // set any layer properties here popupTemplate: new PopupTemplate() } }).then(function(layer){ // add the layer to the map map.add(layer); });
fromPortalItem(params){Promise}static
Creates a new layer instance of the appropriate layer class from an ArcGIS Online or ArcGIS for Portal portal item. If the item points to a service with multiple layers, then a GroupLayer is created. If the item points to a service with a single layer, then the appropriate FeatureLayer, TileLayer, MapImageLayer, SceneLayer, StreamLayer, or ElevationLayer is created.
Parameters:params ObjectThe parameters for loading the portal item.
Specification:portalItem PortalItemThe object representing an ArcGIS Online or ArcGIS for Portal item from which to load the layer.
Returns:Type Description Promise Returns a promise which resolves to the new layer instance. Example:Layer.fromPortalItem({ portalItem: { // autocast as esri/portal/PortalItem id: "8444e275037549c1acab02d2626daaee" } }).then(function(layer){ // add the layer to the map map.add(layer); });
hasEventListener(type){Boolean}
Indicates whether there is an event listener on the instance that matches the provided event name.
Parameter:type StringThe name of the event.
Returns:Type Description Boolean Returns true if the class supports the input event. isFulfilled(){Boolean}
An instance of this class is a Promise. Therefore
isFulfilled()
may be used to verify if the promise is fulfilled (either resolved or rejected). If it is fulfilled,true
will be returned. See the Working with Promises guide page for more information about promises.Returns:Type Description Boolean Indicates whether the promise has been fulfilled (either resolved or rejected). isRejected(){Boolean}
An instance of this class is a Promise. Therefore
isRejected()
may be used to verify if the promise is rejected. If it is rejected,true
will be returned. See the Working with Promises guide page for more information about promises.Returns:Type Description Boolean Indicates whether the promise has been rejected. isResolved(){Boolean}
An instance of this class is a Promise. Therefore
isResolved()
may be used to verify if the promise is resolved. If it is resolved,true
will be returned. See the Working with Promises guide page for more information about promises.Returns:Type Description Boolean Indicates whether the promise has been resolved. load(){Promise}
Loads the resources referenced by this class. This method automatically executes for a View and all of the resources it references in Map if the view is constructed with a map instance.
This method must be called by the developer when accessing a resource that will not be loaded in a View.
Returns:Type Description Promise Resolves when the resources have loaded. on(type, listener){Object}
Registers an event handler on the instance. Call this method to hook an event with a listener. See the Events summary table for a list of listened events.
Parameters:type StringThe name of event to listen for.
listener FunctionThe function to call when the event is fired.
Returns:Type Description Object Returns an event handler with a remove()
method that can be called to stop listening for the event.Property Type Description remove Function When called, removes the listener from the event. - See also:
Example:view.on("click", function(event){ // event is the event handle returned after the event fires. console.log(event.mapPoint); });
otherwise(errback){Promise}
An instance of this class is a Promise. Use
otherwise()
to call a function once the promise is rejected.Parameter:optionalerrback FunctionThe function to execute when the promise fails.
Returns:Type Description Promise Returns a new promise for the result of errback
.Example:// Although this example uses MapView, any class instance that is a promise may use otherwise() in the same way var view = new MapView(); view.otherwise(function(error){ // This function will execute if the promise is rejected due to an error });
then(callback, errback, progback){Promise}
An instance of this class is a Promise. Therefore
then()
may be leveraged once an instance of the class is created. This method takes two input parameters: acallback
function and anerrback
function. Thecallback
executes when the promise resolves (when the instance of the class loads). Theerrback
executes if the promise fails. See the Working with Promises guide page for additional details.Parameters:optionalcallback FunctionThe function to call when the promise resolves.
optionalerrback FunctionThe function to execute when the promise fails.
optionalprogback FunctionThe function to invoke when the promise emits a progress update.
Returns:Type Description Promise Returns a new promise for the result of callback
that may be used to chain additional functions.Example:// Although this example uses MapView, any class instance that is a promise may use then() in the same way var view = new MapView(); view.then(function(){ // This function will execute once the promise is resolved }, function(error){ // This function will execute if the promise is rejected due to an error });
Event Overview
Name | Type | Summary | |
---|---|---|---|
{view: View,layerView: LayerView} | Fires after the layer's LayerView is created and rendered in a view. more details | more details | |
{view: View,layerView: LayerView} | Fires after the layer's LayerView is destroyed and no longer renders in a view. more details | more details |
Event Details
layerview-create
Fires after the layer's LayerView is created and rendered in a view.
- See also:
Properties:view ViewThe view in which the
layerView
was created.layerView LayerViewThe LayerView rendered in the view representing the layer in
layer
.Example:// This function will fire each time a layer view is created for this // particular view. layer.on("layerview-create", function(event){ // The LayerView for the layer that emitted this event event.layerView; });
layerview-destroy
Fires after the layer's LayerView is destroyed and no longer renders in a view.