Hello I am adding a LayerSwipe to my website, and get this error: LayerSwipe::Invalid layer type
The layers displayed in the map currently are featureLayers.
Here's the bit of code that I think it ties to
var layerIds = currentMap.layerIds;
console.log(layerIds); // displays ["layer0", "layer1"]
var layer = layerIds[1];
console.log(layer); // displays layer1
var swipeWidget = new LayerSwipe ({
type: "vertical",
map: currentMap,
layers: [layer]
}, "swipeWidgetId");
swipeWidget.startup();
When ran I get this error: LayerSwipe::Invalid layer type
Any advice for solving this will be greatly appreciated, as I feel I am so close to bringing this functionality to my website. Thanks very much!
Solved! Go to Solution.
I think the issue is related to the fact that the LayerSwipe dijit expects a specific layer type, of which FeatureLayer is not a valid option.
Looking at the sample:
ArcGIS API for JavaScript Sandbox
If you inspect the "swipeLayer" object at line 53 (for example adding a console state below)
console.log ("swipeLayer: ", swipeLayer)
You see it references a MapServer, which makes sense when we look at the layer property of the LayerSwipe dijit:
LayerSwipe | API Reference | ArcGIS API for JavaScript 3.29
Which expects an array of Layer:
Layer | API Reference | ArcGIS API for JavaScript 3.29
Which expects a URL to the ArcGIS Server REST resource that represents a map service
Did you include the module in the require and function arguments?
require(["esri/dijit/LayerSwipe"], function(LayerSwipe) { /* code goes here */ });
I think the issue is related to the fact that the LayerSwipe dijit expects a specific layer type, of which FeatureLayer is not a valid option.
Looking at the sample:
ArcGIS API for JavaScript Sandbox
If you inspect the "swipeLayer" object at line 53 (for example adding a console state below)
console.log ("swipeLayer: ", swipeLayer)
You see it references a MapServer, which makes sense when we look at the layer property of the LayerSwipe dijit:
LayerSwipe | API Reference | ArcGIS API for JavaScript 3.29
Which expects an array of Layer:
Layer | API Reference | ArcGIS API for JavaScript 3.29
Which expects a URL to the ArcGIS Server REST resource that represents a map service
You can add the layer like this:
require(["esri/layers/DynamicMapServiceLayer"], function(DynamicMapServiceLayer) {
//...
var layer = new ArcGISDynamicMapServiceLayer("https://gis.davey.com/arcgis/rest/services/BloomingtonIN/BloomintonIN/MapServer");
map.addLayer(layer);
//...
});
In the example, they are just using layerId to get the layers
var swipeLayer = map.getLayer(id);
So try defining the layer like below instead of using the layer Ids
var layer = new ArcGISDynamicMapServiceLayer("https://gis.davey.com/arcgis/rest/services/BloomingtonIN/BloomintonIN/MapServer");
var swipeWidget = new LayerSwipe ({
type: "vertical",
map: currentMap,
layers: [layer]
}, "swipeWidgetId");
swipeWidget.startup();
Try this
var swipeWidget = new LayerSwipe({
type: "vertical",
map: currentMap,
layers: [newLayer]
}, currentMap.swipeWidgetID);
swipeWidget.startup();
delete this
var layerIds = currentMap.layerIds;
console.log(layerIds); //["layer0", "CouncilDistricts", "Fragmentation", "layer1"]
var layer = layerIds[2];
console.log(layer); //Fragmentation
var wholeLayer = currentMap.getLayer(layer);
console.log(wholeLayer); // the whole ArcGISDynamicMapServiceLayer with 1 visible layer
And no problem, glad to help.
Thank you very much for all of your help! I have a slider now and am rejoicing!
Here is a codepen that I hope will help other people.
I found that featureLayers work just fine, but ArcGUSDynamicMapServiceLayers require "layer._div = map.root" even though I don't understand what this does.
https://codepen.io/RochelleWolfe/pen/YmLKYG