Create a FeatureLayer with client-side graphics

This sample shows how to create a FeatureLayer from client-side graphics. The graphics are created from GPS data extracted from the EXIF data of a set of images.

Creating a FeatureLayer with client-side graphics requires the following steps:

  1. Set an array of graphics on the FeatureLayer.source property. All graphics must have the same geometry type.
  2. Specify an array of field objects, which provide the schema (name, alias, and type) of each attribute field.
  3. Set the objectID field property to a field containing unique IDs for each feature in the source property.

Once the requirements outlined above are set on the layer, other layer properties (e.g. renderer and popupTemplate) may be set allowing you to leverage the benefits of a FeatureLayer, such as client-side querying and fast visual updates.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
const layer = new FeatureLayer({
  source: graphics,  // array of graphics objects
  objectIdField: "OBJECTID",
  fields: [{
    name: "OBJECTID",
    type: "oid"
  }, {
    name: "url",
    type: "string"
  }],
  popupTemplate: {
    content: "<img src='{url}'>"
  },
  renderer: {  // overrides the layer's default renderer
    type: "simple",
    symbol: {
      type: "text",
      color: "#7A003C",
      text: "\ue661",
      font: {
        size: 20,
        family: "CalciteWebCoreIcons"
      }
    }
  }
});

map.add(layer);

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

The developer dashboard has moved

You can no longer sign into this site. Go to your ArcGIS portal or the ArcGIS Location Platform dashboard to perform management tasks.

Your ArcGIS portal

Create, manage, and access API keys and OAuth 2.0 developer credentials, hosted layers, and data services.

Your ArcGIS Location Platform dashboard

Manage billing, monitor service usage, and access additional resources.

Learn more about these changes in the What's new in Esri Developers June 2024 blog post.

Close