Samples

Welcome to a flattened collection of all of the ArcGIS Maps SDK for JavaScript samples. Click a sample's card to navigate to the description page that will explain how the sample works and allow you to interact with the sample in a variety of ways. Use the categories on the right to navigate to the sample of interest. There are 384 samples in the ArcGIS Maps SDK for JavaScript.

Latest samples

Intro to map components

Intro to map components

Intro to map components - Create a 2D map

Mapping and views

Load a basic web map

Load a basic web map

Load a basic WebMap

Mapping and viewsMapView (2D)
Save a web map

Save a web map

Mapping and viewsMapView (2D)
Web scene - slides

Web scene - slides

Mapping and viewsSceneView (3D)
SceneView - hitTest

SceneView - hitTest

Mapping and viewsSceneView (3D)
Composite views

Composite views

Create an app with composite views

Mapping and viewsMultiple views
Disable view navigation

Disable view navigation

Disable all view navigation

Mapping and viewsNavigation
Disable mouse-wheel

Disable mouse-wheel

Disable mouse-wheel and single-touch navigation

Mapping and viewsNavigation
View padding

View padding

Mapping and viewsView properties
View event explorer / watch properties

View event explorer / watch properties

Event explorer / watch properties

Mapping and viewsView properties

Layers

Working with large feature collections

Working with large feature collections

What to do to keep your app interactive when working with large feature collections.

LayersFeatureLayer
Highlight options for layer views

Highlight options for layer views

Assign highlight options for layer views

LayersFeatureLayer
Basic querying on FeatureLayer

Basic querying on FeatureLayer

Basic Querying in FeatureLayer

LayersFeatureLayer
Server side raster function

Server side raster function

ImageryLayer - server side raster function

LayersRaster layers
Select WMTS sublayer

Select WMTS sublayer

Select WMTSLayer sublayer

LayersOGC Layers
WebTileLayer

WebTileLayer

LayersOther tiled layers

Query

Basic querying on FeatureLayer

Basic querying on FeatureLayer

Basic Querying in FeatureLayer

QueryLayer (server-side)
FeatureLayerView - query

FeatureLayerView - query

Query features from a FeatureLayerView

QueryLayerView (client-side)

Editing

Edit FeatureLayer with subtypes

Edit FeatureLayer with subtypes

Editing FeatureLayer with subtypes

EditingEditor widget

Draw

Visualization

Continuous color

Continuous color

Data-driven continuous color

VisualizationRenderers
Unique types

Unique types

Visualize features by type

VisualizationRenderers
Unique value groups

Unique value groups

This sample demonstrates how to categorize unique values into groups with headings.

VisualizationRenderers
Create a reference size visualization

Create a reference size visualization

Create a reference size visualization in a gridded dataset using the reference-size theme.

VisualizationSmart mapping
Relationship

Relationship

Generate a relationship visualization

VisualizationSmart mapping
Intro to binning

Intro to binning

Aggregate points to bins to visualize their density.

VisualizationBinning
Binning with aggregate fields

Binning with aggregate fields

This sample demonstrates how to define aggregate fields that can be used in the popup, labels, and renderer of a binned layer.

VisualizationBinning
Binning - Filter by category

Binning - Filter by category

Demonstrates how to filter binned data by category.

VisualizationBinning
Summarize binned data using Arcade

Summarize binned data using Arcade

Use Arcade in popups to summarize binned crimes by type

VisualizationBinning
Generate suggested configuration

Generate suggested configuration

Clustering - generate suggested configuration

VisualizationClustering
Query clusters

Query clusters

Clustering - query clusters

VisualizationClustering
Filter popup features

Filter popup features

This sample demonstrates how to filter clustered features within a cluster's popup.

VisualizationClustering
Popup charts for point clusters

Popup charts for point clusters

This sample demonstrates how to summarize clustered features using charts within a cluster's popup.

VisualizationClustering
Clustering with visual variables

Clustering with visual variables

Point clustering with visual variables

VisualizationClustering
Intro to heatmap

Intro to heatmap

Visualize points with a heatmap

VisualizationHeatmap
Heatmap (3D)

Heatmap (3D)

Visualize points in a scene with a heatmap

VisualizationHeatmap
Scale-dependent heatmap

Scale-dependent heatmap

Create a scale-dependent visualization

VisualizationHeatmap
Static heatmap

Static heatmap

Create a static heatmap that doesn't adjust based on scale

VisualizationHeatmap
Intro to CIMSymbol

Intro to CIMSymbol

Learn the basics about CIMSymbol and how to use a primitiveOverride on the text

VisualizationVector markers
Arrows along a line

Arrows along a line

Use a CIMSymbol to draw a line with arrow markers at a fixed distance

VisualizationVector markers
WebStyleSymbol - continuous size (2D)

WebStyleSymbol - continuous size (2D)

Proportionally-sized WebStyleSymbols (2D)

VisualizationVector markers
Dictionary renderer

Dictionary renderer

Visualize data with dictionary renderer

VisualizationVector markers
Polygon marker placement

Polygon marker placement

Draw symbols in a map and adjust the CIMSymbol properties such as color, size, and marker placement.

VisualizationVector markers
Realistic WebStyleSymbols

Realistic WebStyleSymbols

Visualize features with realistic WebStyleSymbols

Visualization3D visualization
Realistic water

Realistic water

Realistic water visualization in 3D

Visualization3D visualization
Visualize data on Mars

Visualize data on Mars

Visualization3D visualization
Heatmap in 3D

Heatmap in 3D

Visualize points in a scene with a heatmap

Visualization3D visualization
Custom RenderNode - Crossfade slide transition

Custom RenderNode - Crossfade slide transition

Custom RenderNode - Cross-fade slide transition

Visualization3D visualization
Intro to layer effect

Intro to layer effect

VisualizationVisual effectsLayer and feature effects
Intro to feature effect

Intro to feature effect

Apply featureEffect to FeatureLayer

VisualizationVisual effectsLayer and feature effects
Highlight feature with drop-shadow

Highlight feature with drop-shadow

Highlight a country with an effect

VisualizationVisual effectsLayer and feature effects
FeatureEffect - multiple effects

FeatureEffect - multiple effects

Highlight areas intersecting borough boundaries

VisualizationVisual effectsLayer and feature effects
FeatureEffect - drop-shadow

FeatureEffect - drop-shadow

Apply drop-shadow effects to layerview

VisualizationVisual effectsLayer and feature effects
Update a renderer's attribute

Update a renderer's attribute

Update a renderer's attribute's attribute

VisualizationAnimations
Configure feature sort order

Configure feature sort order

Learn how to configure the drawing order of features in a layer

VisualizationOther
Sort features by legend order

Sort features by legend order

Control the draw order of features to match the order of unique values defined in a UniqueValueRenderer

VisualizationOther
Execute Arcade for a custom chart

Execute Arcade for a custom chart

Execute an Arcade expression defined in a webmap to create a custom chart

VisualizationOther

Popups

Create popup charts from Arcade expressions

Create popup charts from Arcade expressions

This sample demonstrates how to dynamically create popup content elements using Arcade expressions.

PopupTemplate with functions

PopupTemplate with functions

PopupTemplate - use functions to set content

Time

Analysis

Widgets

CoordinateConversion

CoordinateConversion

CoordinateConversion widget

WidgetsCoordinateConversion
CoordinateConversion - custom formats

CoordinateConversion - custom formats

CoordinateConversion widget - Custom Formats

WidgetsCoordinateConversion
LayerList

LayerList

LayerList widget

WidgetsLayerList
Legend

Legend

Legend widget

WidgetsLegend
Swipe

Swipe

Swipe Widget

WidgetsSwipe

Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.