topic layerswipe issue in Developers Questions

layerswipe issue

LosMorales1 — Wed, 01 Apr 2015 14:17:27 GMT

I'm trying to user the layerswipe (JS API) widget in a map that is enclosed in a div that is on a page with many map-based divs. For some reason the layer swipe widget does not apply within the div's dimensions and essentially goes full screen. Also if there is content above the map div and below, when you move the swipe widget it disappears from the map. Scrolling down the page you'll find the swipe widget somewhere else. When I apply the same map style to the swipewidget div, it seems to shift the div to the right so that it is not in sync with the map. Just having all kinds of problems with this widget. Any help would be appreciated.

Re: layerswipe issue

KellyHutchins — Wed, 01 Apr 2015 16:27:23 GMT

I can't reproduce the issue with this sample. Can you provide a code sample that shows the problem?

Re: layerswipe issue

LosMorales1 — Wed, 01 Apr 2015 17:58:06 GMT

Hi, Using the LayerSwipe demo:

<!DOCTYPE HTML>

<html>

<head>

<title>Layer Swipe</title>

<style>

html, body, #map {

padding:0;

margin:0;

height:50em;

width: 80%;

border: 2px solid #a1a1a1;

border-radius: 15px;

}

</style>

require([

"esri/map",

"esri/dijit/LayerSwipe",

"esri/arcgis/utils",

"dojo/_base/array",

"dojo/domReady!"

], function(

Map, LayerSwipe, arcgisUtils, array

) {

var mapDeferred = arcgisUtils.createMap("62702544d70648e593bc05d65180fd64", "map");

mapDeferred.then(function(response){

var id;

var map = response.map;

var title = "2009 Obesity Rates";

//loop through all the operational layers in the web map

//to find the one with the specified title;

var layers = response.itemInfo.itemData.operationalLayers;

array.some(layers, function(layer){

if(layer.title === title){

id = layer.id;

if(layer.featureCollection && layer.featureCollection.layers.length){

id = layer.featureCollection.layers[0].id;

}

return true;

}else{

return false;

}

});

//get the layer from the map using the id and set it as the swipe layer.

if(id){

var swipeLayer = map.getLayer(id);

var swipeWidget = new LayerSwipe({

type: "vertical", //Try switching to "scope" or "horizontal"

map: map,

layers: [swipeLayer]

}, "swipeDiv");

swipeWidget.startup();

}

});

</script>

</head>

<body>

</div>

<p>This is another test</p>

</body>

</html>

Re: layerswipe issue

LosMorales1 — Wed, 01 Apr 2015 18:01:51 GMT

Actually this code below gives a good example of what I'm running into. Notice that when moving the swipe it actually moves down. If the screen had a lot more content and had to be scrolled vertically, the swipe widget will move down as well to the middle of the screen:

<!DOCTYPE HTML>

<html>

<head>

<title>Layer Swipe</title>

<style>

#map {

padding:0;

margin:0;

height:50em;

width: 80%;

border: 2px solid #a1a1a1;

border-radius: 15px;

}

</style>

require([

"esri/map",

"esri/dijit/LayerSwipe",

"esri/arcgis/utils",

"dojo/_base/array",

"dojo/domReady!"

], function(

Map, LayerSwipe, arcgisUtils, array

) {

var mapDeferred = arcgisUtils.createMap("62702544d70648e593bc05d65180fd64", "map");

mapDeferred.then(function(response){

var id;

var map = response.map;

var title = "2009 Obesity Rates";

//loop through all the operational layers in the web map

//to find the one with the specified title;

var layers = response.itemInfo.itemData.operationalLayers;

array.some(layers, function(layer){

if(layer.title === title){

id = layer.id;

if(layer.featureCollection && layer.featureCollection.layers.length){

id = layer.featureCollection.layers[0].id;

}

return true;

}else{

return false;

}

});

//get the layer from the map using the id and set it as the swipe layer.

if(id){

var swipeLayer = map.getLayer(id);

var swipeWidget = new LayerSwipe({

type: "vertical", //Try switching to "scope" or "horizontal"

map: map,

layers: [swipeLayer]

}, "swipeDiv");

swipeWidget.startup();

}

});

</script>

</head>

<body>

</div>

<p>This is another test</p>

</body>

</html>

Re: layerswipe issue

KellyHutchins — Wed, 01 Apr 2015 19:36:46 GMT

This looks like a bug. Can you report this issue to Esri Support?

Re: layerswipe issue

BruceRalston — Mon, 29 Feb 2016 17:21:00 GMT

I can reproduce this intermittently with the sample running in the sandbox. Simply make the map div to be less than the full screen. Most of the time the swipe will exceed the map. Once in a while it will behave correctly. Definitely seems like a bug.