Well made a little progress before hitting another road block. Trying to toggle visibility of n number of layers by check box. The code below loads up fine, but I get a "visible[lc] is undefined" and "a.join is not a function" errors in the console. I played around with it for about four hours and all I could get it to do what load both layers at the same time when clicking either check box. Obviously, the check boxes need to be independent of one another. I think the error lies in the for loops. Did not testing and it has the correct number for "layers", and also for "il". What am I missing?Also, not sure if this "imageParameters.layerIds = [0,1,2];" is correct? I have the webmap loaded, then two layers on top, shouldn't that be correct with an index of "0"?
<script src="http://js.arcgis.com/3.9/"></script>
<script>
require([
"esri/map",
"dojo/parser",
"dojo/ready",
"dijit/layout/BorderContainer",
"dijit/layout/ContentPane",
"dojo/dom",
"dojo/on",
"dojo/query",
"esri/layers/CSVLayer",
"esri/Color",
"esri/symbols/SimpleMarkerSymbol",
"esri/renderers/SimpleRenderer",
"esri/InfoTemplate",
"esri/urlUtils",
"esri/arcgis/utils",
"esri/dijit/Legend",
"esri/dijit/Scalebar",
"esri/layers/ArcGISDynamicMapServiceLayer",
"esri/layers/FeatureLayer",
"esri/layers/ImageParameters",
"dojo/domReady!"
], function(
Map,
parser,
ready,
BorderContainer,
ContentPane,
dom,
on,
query,
CSVLayer,
Color,
SimpleMarkerSymbol,
SimpleRenderer,
InfoTemplate,
urlUtils,
arcgisUtils,
Legend,
Scalebar,
ArcGISDynamicMapServiceLayer,
FeatureLayer,
ImageParameters
) {
ready(function(){
parser.parse();
var visible = [] ,layers = [];
arcgisUtils.createMap("964718e320ea4fc4abcc73ada068d015","map").then(function(response){
//update the app
var map = response.map;
//Use the ImageParameters to set the invisible layers in the map service during ArcGISDynamicMapServiceLayer construction.
var imageParameters = new ImageParameters();
imageParameters.layerIds = [0,1,2];
imageParameters.layerOption = ImageParameters.LAYER_OPTION_HIDE;
//can also be: LAYER_OPTION_EXCLUDE, LAYER_OPTION_HIDE, LAYER_OPTION_INCLUDE
//Takes a URL to a non cached map service.
var dynamicMapServiceLayer1 = new ArcGISDynamicMapServiceLayer("http://gis.srh.noaa.gov/ArcGIS/rest/services/RIDGERadar/MapServer", {
"opacity" : 0.5,"imageParameters":imageParameters});
//Takes a URL to a non cached map service.
var dynamicMapServiceLayer2 = new ArcGISDynamicMapServiceLayer("http://gisdev.srh.noaa.gov/arcgis/rest/services/GSP/gffg/MapServer", {
"opacity" : 0.5,"imageParameters":imageParameters});
map.addLayer(dynamicMapServiceLayer1);
layers.push(dynamicMapServiceLayer1);
map.addLayer(dynamicMapServiceLayer2);
layers.push(dynamicMapServiceLayer2);
on(dom.byId("layer1CheckBox"), "change", updateLayerVisibility);
on(dom.byId("layer2CheckBox"), "change", updateLayerVisibility);
// var csv = new CSVLayer("./data/180query.csv");
// var orangeRed = new Color([238, 69, 0, 0.5]); // hex is #ff4500
// var marker = new SimpleMarkerSymbol("solid", 15, null, orangeRed);
// var renderer = new SimpleRenderer(marker);
// csv.setRenderer(renderer);
// var template = new InfoTemplate("${lid}", "${name}");
// csv.setInfoTemplate(template);
// map.addLayer(csv);
//Sets up the ability for dynamicMapServiceLayers to be toggled.
console.log(layers)
function updateLayerVisibility() {
var lc = 0;
var li = 0;
var inputs = dojo.query(".list_item"), input;
visible = [];
for (var i=0, il=inputs.length; i<il; i++) {
if(i>=li+layers[lc].layerInfos.length) {
lc++;
li=i;
}
if (inputs.checked) {
visible[lc].push(inputs.id-li);
}
}
for (var t=0, tl=layers.length; t<tl; t++)
layers.setVisibleLayers(visible);}
});
});
});
</script>
