Edit feature data

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
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
    <!-- require ArcGIS REST JS libraries from https://unpkg.com -->
    <script src="https://unpkg.com/@esri/arcgis-rest-request@4.0.0/dist/bundled/request.umd.js"></script>
    <script src="https://unpkg.com/@esri/arcgis-rest-feature-service@4.0.0/dist/bundled/feature-service.umd.js"></script>
    <script>
      /* when including ArcGIS REST JS all exports are available
    from the same arcgisRest global */

      const apiKey = "YOUR_API_KEY";

      const authentication = arcgisRest.ApiKeyManager.fromKey(apiKey);

      const featureServiceLayerUrl = "https://services3.arcgis.com/GVgbJbqm8hXASVYi/ArcGIS/rest/services/my_points/FeatureServer/0";

      const featureToAdd = {
        attributes: {
          id: 101,
          name: "editing test",
          rating: "2"
        },
        geometry: {
          x: -118.807,
          y: 34.002,
          spatialReference: {
            wkid: 4326
          }
        }
      };

      // begin by adding a new feature to the feature service layer,
      // then update its attributes,
      // and finally delete it from the layer
      arcgisRest
        .addFeatures({
          url: featureServiceLayerUrl,
          features: [featureToAdd],
          authentication
        })
        .then(handleAdded);

      function handleAdded(response) {
        console.log(response);
        document.getElementById("result-add").textContent = JSON.stringify(response, null, 2);

        if (!response.addResults[0].success) {
          // stop early if adding a new feature was not successful
          return;
        }

        // perform an update to feature attributes using the objectId of the newly added feature
        const featureToUpdate = {
          attributes: {
            objectId: response.addResults[0].objectId,
            name: "new name",
            rating: "3"
          }
        };

        arcgisRest
          .updateFeatures({
            url: featureServiceLayerUrl,
            features: [featureToUpdate],
            authentication
          })
          .then(handleUpdated);
      }

      function handleUpdated(response) {
        console.log(response);
        document.getElementById("result-update").textContent = JSON.stringify(response, null, 2);

        if (!response.updateResults[0].success) {
          // stop early if updating the feature was not successful
          return;
        }

        // delete the feature using the objectId of the updated feature
        // NOTE: it is the same objectId provided in the response of `arcgisRest.addFeatures`
        const featureToDelete = [response.updateResults[0].objectId];

        arcgisRest
          .deleteFeatures({
            url: featureServiceLayerUrl,
            objectIds: [featureToDelete],
            authentication
          })
          .then(handleDeleted);
      }

      function handleDeleted(response) {
        console.log(response);
        document.getElementById("result-delete").textContent = JSON.stringify(response, null, 2);
      }

    </script>