AnsweredAssumed Answered

Is it possible to add a transparent web map tile layer over feature layers?

Question asked by azendel on Dec 12, 2013
Latest reply on Dec 13, 2013 by azendel
I created a MapBox layer on their website that has transparent background and non-transparent streets, street labels and city labels.  I'm wanting to overlay this mostly transparent  layer on top of some polygon feature layers served via our AGO 'Organizational Account'.  I'll eventually add a MapBox base layer.  So my 'map stack' will look like the following with the top listed layer on top:

Transparent MapBox Layer (streets and labels)
Polygon Feature Layer
Polygon Feature Layer
Opaque MapBox Layer

I've read the documentation and found that the first non-base layer called in map.addLayer() draws underneath the subsequent layers called in addLayer. The transparent label layer is rendering in my map, but the problem is that the transparent layer is rendering underneath the the polygon feature layers.  This makes me think that the ArcGIS 3.7 JS library forces tile layers under feature layers or other 'operational layers'.  Can anybody confirm?  How do I get my transparent tile layer to render on top of the polygon layers?  Thanks in advance for your help. 

My code is below


<script src="http://js.arcgis.com/3.7/"></script>      <script>         var map;         require([           "esri/map", "esri/layers/WebTiledLayer", "esri/InfoTemplate", "esri/layers/FeatureLayer",           "dojo/parser", "dojo/domReady!"         ], function (           Map, WebTiledLayer, InfoTemplate, FeatureLayer,           parser         ) {             parser.parse();             map = new Map("mapDiv", {                 basemap: "national-geographic",                 center: [-96.541, 38.34],                 zoom: 6             });              map.on("load", initOperationalLayer);              function initOperationalLayer() {                 var infoTemplate = new InfoTemplate("${NAME10}", "Population (2010):  ${TOTALPOPULATION:NumberFormat}");                 var tractLayer = new FeatureLayer("https://services2.arcgis.com/Gypl21NmiWS1cM7h/arcgis/rest/services/ThreeDemographicMaps2/FeatureServer/2", {                     mode: FeatureLayer.MODE_ONDEMAND,                     outFields: ["*"] ,                     infoTemplate: infoTemplate                  });                  var infoTemplate2 = new InfoTemplate("${NAME10}", "Percent Black:  ${PercentBlack:NumberFormat}");                 var countyLayer = new FeatureLayer("https://services2.arcgis.com/Gypl21NmiWS1cM7h/arcgis/rest/services/CountyDemographics3/FeatureServer/0", {                     mode: FeatureLayer.MODE_ONDEMAND,                     outFields: ["*"],                     infoTemplate: infoTemplate2                 });                                  var mapBox = new WebTiledLayer("https://a.tiles.mapbox.com/v3/xxyyzz.ghbjgh0h/{level}/{col}/{row}.png", {                     "copyright": "<a href=\"http://www.openstreetmap.org/copyright/\">OpenStreetMap and its contributors</a>",                     "id": "MapBox"                  });                  map.addLayer(countyLayer);                 map.addLayer(tractLayer);                 map.addLayer(mapBox);                 map.infoWindow.resize(155, 75);             }         });     </script> 

Outcomes