ArcGIS map polygon store in ArcGIS

Question

I have to store the created polygon in ArcGIS. Once the polygon is stored in ArcGIS, it returns an ID (Object ID). With the object ID, the administrator can access the polygon in ArcGIS. I found a piece of code in one of our old systems the code is written in version 3xx.

function SendFeaturesToParent()
    {
        editingEnabled = false;
        editToolbar.deactivate();
        lyrMeters.clearSelection();

        polygon = currentEVT.graphic.geometry;

        var query = new Query();
        query.geometry = polygon;

        lyrAreas.applyEdits(null, [currentEVT.graphic], null);

        var attributes = [];
        var featureValues = [];
        for (var x = 0; x < selectedfeatures.length; x++) {
            featureValues.push("METER_ID: " + selectedfeatures[x].attributes["METER_ID"] + ", Type: " + selectedfeatures[x].attributes["Type"]);
            attributes.push(selectedfeatures[x].attributes);
        }
        console.log("attributes"+ attributes);
        //Send the array of meter values back to the parent page.
        var objectId = lyrAreas._defnExpr;
      objectId = objectId.split('=');
        window.parent.postMessage(
            {
                event_id: 'my_cors_message',
                data: attributes,
              objectId: objectId[1]
            }, 
            "*" //or "www.parentpage.com"
        ); 
        $('#modelConfirm').modal('hide');
    }

I need to implement in latest version of arcGIS API 4.23. What are the applyEdits do?

/**** modified code in 4.23 */

var token = '';
const PermitAreaURL = "url_1";
const locatorUrl = "url_2";
const streetmapURL = "url_3";
const streetmapLebelsURL = "url_4";
const MetersURL = "url_5";
const MetersWholeURL = "url_6";

require(["esri/config",
    "esri/Map",
    "esri/views/MapView",
    "esri/layers/FeatureLayer",
    "esri/layers/TileLayer",
    "esri/layers/VectorTileLayer",
    "esri/layers/GraphicsLayer",
    "esri/widgets/Search",
    "esri/widgets/Sketch/SketchViewModel",
    "esri/geometry/geometryEngineAsync",
],
    function (esriConfig, Map, MapView, FeatureLayer, TileLayer, VectorTileLayer, GraphicsLayer, Search, SketchViewModel, geometryEngineAsync) {
        esriConfig.apiKey = "AAPK3f43082c24ae493196786c8b424e9f43HJcMvP1NYaqIN4p63qJnCswIPsyHq8TQHlNtMRLWokqJIWYIJjga9wIEzpy49c9v";

        const graphicsLayer = new GraphicsLayer();

        const streetmapTMLayer = new TileLayer({
            url: streetmapURL
        });

        const streetmapLTMLayer = new VectorTileLayer({
            url: streetmapLebelsURL
        });

        const lyrwholeMeters = new FeatureLayer({
            url: MetersWholeURL,
            outFields: ["*"],
        });

        const lyrMeters = new FeatureLayer({
            url: MetersURL,
            outFields: ["*"],
        });

        //  const permitAreaUrl = new FeatureLayer({
        //     url: PermitAreaURL,
        //     outFields: ["*"],
        // });

        // console.log(lyrMeters);

        const map = new Map({
            basemap: "arcgis-topographic", // Basemap layer service
            layers: [streetmapTMLayer, streetmapLTMLayer, lyrMeters, lyrwholeMeters, graphicsLayer]

        });

        const view = new MapView({
            map: map,
            center: [-95.9406, 41.26],
            zoom: 16,
            maxZoom: 21,
            minZoom: 13,
            container: "viewDiv" // Div element
        });

        view.when(() => {

            const polygonSymbol = {
                type: "simple-fill", // autocasts as new SimpleFillSymbol()
                color: [207, 34, 171, 0.5],
                outline: {
                    // autocasts as new SimpleLineSymbol()
                    color: [247, 34, 101, 0.9],
                }
            };

            const sketchViewModel = new SketchViewModel({
                view: view,
                layer: graphicsLayer,
                polygonSymbol: polygonSymbol,
            });

            sketchViewModel.create("polygon", { mode: "hybrid" });

            // Once user is done drawing a rectangle on the map
            // use the rectangle to select features on the map and table
            sketchViewModel.on("create", async (event) => {
                if (event.state === "complete") {
                    // this polygon will be used to query features that intersect it
                    const geometries = graphicsLayer.graphics.map(function (graphic) {
                        return graphic.geometry
                    });
                    const queryGeometry = await geometryEngineAsync.union(geometries.toArray());
                    selectFeatures(queryGeometry);
                }
            });
        });

        // This function is called when user completes drawing a rectangle
        // on the map. Use the rectangle to select features in the layer and table
        function selectFeatures(geometry) {


            console.log(geometry.rings);
            // create a query and set its geometry parameter to the
            // rectangle that was drawn on the view
            const query = {
                geometry: geometry,
                outFields: ["*"]
            };

            lyrwholeMeters.queryFeatures(query).then(function (results) {
                var lyr = results.features;
                console.log(lyr);

                // save the polygon
                lyr.applyEdits({
                    addFeatures: [geometry] /*updates*/
                });

                lyr.forEach(element => {
                    console.log(`MeterID-${element.attributes.METER_ID}, OBJECTID-${element.attributes.OBJECTID}, Passport_ID-${element.attributes.Passport_ID}`);
                });
            });
        }

        // search widget
        const searchWidget = new Search({
            view: view,
        });

        view.ui.add(searchWidget, {
            position: "top-left",
            index: 2
        });

    });

ArcGIS map polygon store in ArcGIS

Answers (1)

Related Questions