https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/esri-js-4-x-tilelayer-capabilities-property/m-p/1271443#M80851 <P>I have a cached map image service that I am calling in a JS web app (JS 4.x) using TileLayer(). The cached service has about 20 sublayers in it. My goal is to allow end-users to toggle each sublayer's visibility. According to documentation (<A href="https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-TileLayer.html" target="_blank" rel="noopener">https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-TileLayer.html</A>) you can access "<SPAN>supportsSublayerVisibility" via the Capabilities property. I have set that parameter to "true." When I try and toggle the visibility, the "eye" changes on click, but the data in the map is not affected (i.e. the visibility does not actually change).</SPAN></P><P>Here is an image of my LayerList()&nbsp;</P><P><span class="lia-inline-image-display-wrapper lia-image-align-inline" image-alt="moremeowbell_0-1679677565140.png" style="width: 400px;"><img src="https://community.esri.com/t5/image/serverpage/image-id/66215i340770221D46EA05/image-size/medium?v=v2&amp;px=400" role="button" title="moremeowbell_0-1679677565140.png" alt="moremeowbell_0-1679677565140.png" /></span></P><P>&nbsp;</P><P>Here is the portion of my code that touches the dataset:</P><P>&nbsp;</P><LI-CODE lang="javascript">let layer = new TileLayer({ portalItem: { id: "PORTAL ID", } }); layer.load() .then(function(){ layer.capabilities.exportMap.supportsSublayerVisibility = true; layer.capabilities.exportMap.supportsDynamicLayers = true; layer.capabilities.exportMap.supportsSublayersChanges = true; layer.capabilities.exportMap.supportsSublayerDefinitionExpression = true; map.add(layer); }); function visListItemCreate(event){ let item = event.item; const item_type = item.layer.type if (item_type === "tile"){ const tileSublyrs = item.layer.allSublayers let sublyrObjects = [] for(var i = 0; i&lt;tileSublyrs.items.length; i++){ sublyrObjects.push(tileSublyrs.items[i]) } } else{ item.hidden = true } }; const layerList = new LayerList({ view, selectionEnabled: true, listItemCreatedFunction: visListItemCreate, container: "layers-container" });</LI-CODE><P>&nbsp;</P><P>&nbsp;</P><P>Here is the properties that the cache is showing:</P><P><span class="lia-inline-image-display-wrapper lia-image-align-inline" image-alt="moremeowbell_1-1679677915235.png" style="width: 400px;"><img src="https://community.esri.com/t5/image/serverpage/image-id/66216iC35F960277E5B4C2/image-size/medium?v=v2&amp;px=400" role="button" title="moremeowbell_1-1679677915235.png" alt="moremeowbell_1-1679677915235.png" /></span></P><P>&nbsp;</P><P>Any ideas as to what is going on and how to fix it?</P> Fri, 24 Mar 2023 17:13:18 GMT moremeowbell 2023-03-24T17:13:18Z https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/esri-js-4-x-tilelayer-capabilities-property/m-p/1271443#M80851 <P>I have a cached map image service that I am calling in a JS web app (JS 4.x) using TileLayer(). The cached service has about 20 sublayers in it. My goal is to allow end-users to toggle each sublayer's visibility. According to documentation (<A href="https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-TileLayer.html" target="_blank" rel="noopener">https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-TileLayer.html</A>) you can access "<SPAN>supportsSublayerVisibility" via the Capabilities property. I have set that parameter to "true." When I try and toggle the visibility, the "eye" changes on click, but the data in the map is not affected (i.e. the visibility does not actually change).</SPAN></P><P>Here is an image of my LayerList()&nbsp;</P><P><span class="lia-inline-image-display-wrapper lia-image-align-inline" image-alt="moremeowbell_0-1679677565140.png" style="width: 400px;"><img src="https://community.esri.com/t5/image/serverpage/image-id/66215i340770221D46EA05/image-size/medium?v=v2&amp;px=400" role="button" title="moremeowbell_0-1679677565140.png" alt="moremeowbell_0-1679677565140.png" /></span></P><P>&nbsp;</P><P>Here is the portion of my code that touches the dataset:</P><P>&nbsp;</P><LI-CODE lang="javascript">let layer = new TileLayer({ portalItem: { id: "PORTAL ID", } }); layer.load() .then(function(){ layer.capabilities.exportMap.supportsSublayerVisibility = true; layer.capabilities.exportMap.supportsDynamicLayers = true; layer.capabilities.exportMap.supportsSublayersChanges = true; layer.capabilities.exportMap.supportsSublayerDefinitionExpression = true; map.add(layer); }); function visListItemCreate(event){ let item = event.item; const item_type = item.layer.type if (item_type === "tile"){ const tileSublyrs = item.layer.allSublayers let sublyrObjects = [] for(var i = 0; i&lt;tileSublyrs.items.length; i++){ sublyrObjects.push(tileSublyrs.items[i]) } } else{ item.hidden = true } }; const layerList = new LayerList({ view, selectionEnabled: true, listItemCreatedFunction: visListItemCreate, container: "layers-container" });</LI-CODE><P>&nbsp;</P><P>&nbsp;</P><P>Here is the properties that the cache is showing:</P><P><span class="lia-inline-image-display-wrapper lia-image-align-inline" image-alt="moremeowbell_1-1679677915235.png" style="width: 400px;"><img src="https://community.esri.com/t5/image/serverpage/image-id/66216iC35F960277E5B4C2/image-size/medium?v=v2&amp;px=400" role="button" title="moremeowbell_1-1679677915235.png" alt="moremeowbell_1-1679677915235.png" /></span></P><P>&nbsp;</P><P>Any ideas as to what is going on and how to fix it?</P> Fri, 24 Mar 2023 17:13:18 GMT https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/esri-js-4-x-tilelayer-capabilities-property/m-p/1271443#M80851 moremeowbell 2023-03-24T17:13:18Z