ESRI Map

The ESRI Map component shows an interactive map from the ArcGIS API for JavaScript (version 4.9). It supports ArcGIS basemaps, a 3D view, custom vector tile styles, and layers that you insert into the map.

The map loads the ArcGIS API from js.arcgis.com, so the browser needs access to that site.

For a reference of all properties of the map and its layers, see ESRI Map Properties.

To add an ESRI Map, select the stage or group where you want the map to reside and choose Insert > Components > ESRI Map.

The new map contains a sample table in its dataflow with latitude and longitude columns that you can use with the map's layers and groups.

To change what the map shows, select the map and use the Map section of the Property Inspector:

• Map Type selects the ArcGIS basemap, for example Streets, Satellite, Topo, or Dark Gray Vector.
• 3D View shows the map as a 3D globe (scene) instead of a flat map.
• Latitude, Longitude, and Zoom set the center and zoom level. They are updated when the user moves the map.
• Min Zoom and Max Zoom limit the zoom levels that the user can reach.

The current extent of the map is reflected in its boundsNorth, boundsSouth, boundsEast and boundsWest properties. To change the extent of the map, set these properties.

Instead of a predefined basemap, you can use a custom vector tile style. Create the style with the ArcGIS Vector Tile Style Editor, and then, in the Advanced properties of the map, either:

• set mapStyleUrl to the URL of the style, or
• paste the style JSON into mapStyle.

When either property is set, it replaces the basemap selected in Map Type. Clear both properties to use Map Type again.

The positions of the zoom, navigation and compass tools, and their distance from the map edges, are set by the zoomToolPosition, navigationToolPosition, compassToolPosition and toolPadding* properties.

To add layers to an ESRI Map, select the map and choose Insert > Components. The following types of layers can be added:

• ESRI Map Group: Places components or a symbol repeater at map coordinates, like the Map Group of the Google Map. It can animate the movement of repeater items when the data changes.
• ESRI Map GeoJSON Layer: Draws points or polygons from GeoJSON data.
• ESRI Map Heatmap Layer: Uses color coding to show the density and intensity of points in a table.

1. Create a symbol to use as the map marker.
2. Right-click the ESRI Map in the Outline, and select Insert > Components > ESRI Map Group.
3. With the group selected, in the Property Inspector under Repeater:
   1. For Symbol, enter the name of the symbol.
   2. Bind the table that contains your coordinates to Data.
   3. For Latitude Field and Longitude Field, type the names of the table columns that contain this data.

To animate the markers when the coordinates change, set animateIdValues to TRUE in the Advanced properties of the group, and set idField to a table column that uniquely identifies each row.

1. Right-click the ESRI Map in the Outline, and select Insert > Components > ESRI Map Heatmap Layer.
2. With the layer selected, in the Property Inspector under Heat Map:
   1. Bind the table to Table.
   2. For Lat Field and Lng Field, type the names of the coordinate columns.
   3. For Intensity Field, type the name of the column that contains the values.
   4. Adjust Item Radius and the Fill gradient. Optionally set Data Min and Data Max to use a fixed intensity range.

1. Right-click the ESRI Map in the Outline, and select Insert > Components > ESRI Map GeoJSON Layer.
2. With the layer selected, in the Property Inspector under GeoJSON:
   1. Enter or bind the GeoJSON string to Data.
   2. Set Layer Type to Circle for point features or Polygon for area features.
   3. Style the features with the fill, stroke, and circle properties.