Looping through all FeatureLayers in map using ArcGIS API for JavaScript

Question 1

I have featurelayers and I need to loop through all my featurelayers (in my map), to apply the Editor widget "esri/widgets/Editor", to the layers in my map (uploaded from ArcGIS Server online), because I need to add (edit, delete, update capibilities to my featurelayers in the same document).

Could you guide me?

Here is my code, I have this error message, when I run it

"Uncaught (in promise) TypeError: view.map.loadAll is not a function at code.html: 410 "

I understand now that this method is for a WebMap), but how to do with my featurelayers (I only have featurelayers). Here is all the code '''

 let mypopup = {
 title: "{Loc_Eng}",
 content: [{
 type: "fields",
 fieldInfos: [{
 fieldName: "Total_Pop",
 label: "Population"
 }, {
 fieldName: "Total_M",
 label: "Male"
 }, {
 fieldName: "Total_Fe",
 label: "Female"
 }]
 }]
 };
 //Localities
 let featureLayer1 = new FeatureLayer({
 url: "https://services6.arcgis.com/nEMEkLg8rZV7Ijyb/ArcGIS/rest/services/SudanMap/FeatureServer/2",
 popupTemplate: mypopup,
 });
 //Rivers
 let featureLayer2 = new FeatureLayer({
 url: "https://services6.arcgis.com/nEMEkLg8rZV7Ijyb/ArcGIS/rest/services/SudanMap/FeatureServer/0",
 minScale: 100000000
 });
 let map1 = new Map({
 basemap: "satellite",
 ground: "world-elevation",
 
 });
 map1.add(featureLayer1)
 map1.add(featureLayer2)
 let view1 = new MapView({
 map: map1,
 container: "viewDiv",
 center: [29.4917691, 14.5844444],
 zoom: 4
 });
 view1.when(() => {
 view1.map.loadAll().then(() => {
 view1.map.forEach((layer) => {
 if (layer.type === "feature") {
 switch (layer.geometryType) {
 case "polygon":
 polygonLayer = layer;
 break;
 case "polyline":
 lineLayer = layer;
 break; 
 case "point":
 pointLayer = layer;
 break;
 }
 }
 });
 // Create layerInfos for layers in Editor. This
 // sets the fields for editing.
 const pointInfos = {
 layer: pointLayer,
 fieldConfig: [{
 name: "LOCALITY",
 label: "Locality"
 }, {
 name: "SETTLEMENT",
 label: "SETTLEMENT"
 }]
 };
 const polyInfos = {
 layer: polygonLayer,
 fieldConfig: [{
 name: "DATE_ ",
 label: "DATE"
 }, {
 name: "NAME",
 label: "NAME"
 }]
 };
 const editor = new Editor({
 view: view,
 
 layerInfos: [{
 layer: pointLayer,
 fieldConfig: [pointInfos]
 }, {
 layer: lineLayer,
 fieldConfig: [lineInfos]
 }, {
 layer: polygonLayer,
 fieldConfig: [polyInfos]
 }],
 // Set the snapping options for the Editor. By default, snapping is enabled. This can be toggled on/off using the CTRL key.
 snappingOptions: {
 enabled: true,
 selfEnabled: true,
 featureEnabled: true,
 featureSources: [{
 layer: pointLayer
 }, {
 layer: lineLayer
 }, {
 layer: polygonLayer
 }]
 }
 });
 // Add widget to top-right of the view
 view1.ui.add(editor, "top-right");
 });
 });
 });
</script>
<div id="viewDiv"></div>
<span id="help-window"></span>
<style>
 #help-window {
 font-size: 20px;
 font-weight: bold;
 font-family: sans-serif;
 color: white
 }
</style>

'''

Question 2

You should continue this discussion in your original post

Question 3

How to do it ? (the comment doesn't accept my code) because of the limited number of chars

Question 4

Can you edit your original post to add the new code?

Question 5

I can't because it is about another thing that I added when I received an answer on my previous post, so I should continue after the answer (not in the same post)

Question 6

Take a look at Editor widget with configurations sample

In it, the code uses this line to cycle through all the layers:

 view.map.layers.forEach((layer) => {

Update:

Here is a sample that cycles through your layers in a map.

<html>
<head>
 <meta charset="utf-8" />
 <meta name="viewport"
 content="initial-scale=1,maximum-scale=1,user-scalable=no" />
 <title>
 Intro to FeatureLayer | Sample | ArcGIS API for JavaScript 4.20
 </title>
 <link rel="stylesheet"
 href="https://js.arcgis.com/4.20/esri/themes/light/main.css" />
 <script src="https://js.arcgis.com/4.20/"></script>
 <style>
 html,
 body,
 #viewDiv {
 padding: 0;
 margin: 0;
 height: 100%;
 width: 100%;
 }
 </style>
 <script>
 require(["esri/Map", "esri/views/MapView", "esri/layers/FeatureLayer"], (
 Map,
 MapView,
 FeatureLayer
 ) => {
 const map = new Map({
 basemap: "hybrid"
 });
 const view = new MapView({
 container: "viewDiv",
 map: map,
 extent: {
 // autocasts as new Extent()
 xmin: 17.0884,
 ymin: 13.0153,
 xmax: 43.3005,
 ymax: 23.8466,
 spatialReference: 4326
 }
 });
 /********************
 * Add feature layers
 ********************/
 const fl1 = new FeatureLayer({
 url:
 "https://services6.arcgis.com/nEMEkLg8rZV7Ijyb/ArcGIS/rest/services/SudanMap/FeatureServer/0"
 });
 const fl2 = new FeatureLayer({
 url:
 "https://services6.arcgis.com/nEMEkLg8rZV7Ijyb/ArcGIS/rest/services/SudanMap/FeatureServer/1"
 });
 const fl3 = new FeatureLayer({
 url:
 "https://services6.arcgis.com/nEMEkLg8rZV7Ijyb/ArcGIS/rest/services/SudanMap/FeatureServer/2"
 });
 map.addMany([fl1, fl2, fl3]);
 view.when(() => {
 console.log("Loaded");
 view.map.layers.forEach((layer) => {
 if (layer.type == 'feature') {
 switch (layer.geometryType) {
 case "polygon":
 console.log(layer.title + ": Polygon");
 break;
 case "polyline":
 console.log(layer.title + ": Line");
 break;
 case "point":
 console.log(layer.title + ": Point");
 break;
 default:
 console.log("Other");
 }
 }
 });
 });
 });
 </script>
</head>
<body>
 <div id="viewDiv"></div>
</body>
</html>

Question 7

it doesn't work, it gives me this message error: Uncaught TypeError: r.load is not a 4.20:1879 function at w.B._createLayerView (4.20:1879) at E.A.z._doWork [as callback] (4.20:1875) at u (4.20:168) at 4.20:172

Question 8

and for the example Editor widget with configurations, I already seen it but it is also for WebMap (not for seperated featureLayers on a Map)

Question 9

Please see the updated code

Question 10

thank you, I will try it and get back to you (Big thank you)

Question 11

I find the issue (with help), we don't need to loop trough the layers. The Editor-Widget itself checks the editable layers and add them to the widget

kenbuja kenbuja 5,9152 gold badges20 silver badges31 bronze badges · Accepted Answer · 2021-07-14 13:58:44Z

Take a look at Editor widget with configurations sample

In it, the code uses this line to cycle through all the layers:

 view.map.layers.forEach((layer) => {

Update:

Here is a sample that cycles through your layers in a map.

<html>
<head>
 <meta charset="utf-8" />
 <meta name="viewport"
 content="initial-scale=1,maximum-scale=1,user-scalable=no" />
 <title>
 Intro to FeatureLayer | Sample | ArcGIS API for JavaScript 4.20
 </title>
 <link rel="stylesheet"
 href="https://js.arcgis.com/4.20/esri/themes/light/main.css" />
 <script src="https://js.arcgis.com/4.20/"></script>
 <style>
 html,
 body,
 #viewDiv {
 padding: 0;
 margin: 0;
 height: 100%;
 width: 100%;
 }
 </style>
 <script>
 require(["esri/Map", "esri/views/MapView", "esri/layers/FeatureLayer"], (
 Map,
 MapView,
 FeatureLayer
 ) => {
 const map = new Map({
 basemap: "hybrid"
 });
 const view = new MapView({
 container: "viewDiv",
 map: map,
 extent: {
 // autocasts as new Extent()
 xmin: 17.0884,
 ymin: 13.0153,
 xmax: 43.3005,
 ymax: 23.8466,
 spatialReference: 4326
 }
 });
 /********************
 * Add feature layers
 ********************/
 const fl1 = new FeatureLayer({
 url:
 "https://services6.arcgis.com/nEMEkLg8rZV7Ijyb/ArcGIS/rest/services/SudanMap/FeatureServer/0"
 });
 const fl2 = new FeatureLayer({
 url:
 "https://services6.arcgis.com/nEMEkLg8rZV7Ijyb/ArcGIS/rest/services/SudanMap/FeatureServer/1"
 });
 const fl3 = new FeatureLayer({
 url:
 "https://services6.arcgis.com/nEMEkLg8rZV7Ijyb/ArcGIS/rest/services/SudanMap/FeatureServer/2"
 });
 map.addMany([fl1, fl2, fl3]);
 view.when(() => {
 console.log("Loaded");
 view.map.layers.forEach((layer) => {
 if (layer.type == 'feature') {
 switch (layer.geometryType) {
 case "polygon":
 console.log(layer.title + ": Polygon");
 break;
 case "polyline":
 console.log(layer.title + ": Line");
 break;
 case "point":
 console.log(layer.title + ": Point");
 break;
 default:
 console.log("Other");
 }
 }
 });
 });
 });
 </script>
</head>
<body>
 <div id="viewDiv"></div>
</body>
</html>

it doesn't work, it gives me this message error: Uncaught TypeError: r.load is not a 4.20:1879 function at w.B._createLayerView (4.20:1879) at E.A.z._doWork [as callback] (4.20:1875) at u (4.20:168) at 4.20:172
and for the example Editor widget with configurations, I already seen it but it is also for WebMap (not for seperated featureLayers on a Map)
thank you, I will try it and get back to you (Big thank you)
I find the issue (with help), we don't need to loop trough the layers. The Editor-Widget itself checks the editable layers and add them to the widget

Stack Exchange Network

Looping through all FeatureLayers in map using ArcGIS API for JavaScript

1 Answer 1

Your Answer

Sign up or log in

Post as a guest

Post as a guest

Linked

Hot Network Questions

Looping through all FeatureLayers in map using ArcGIS API for JavaScript

1 Answer 1

Your Answer

Sign up or log in

Post as a guest

Post as a guest

Linked

Related

Hot Network Questions