How to get layer orders displayed and layers in proper order

7462
11
Jump to solution
01-12-2012 05:19 AM
DanRicketts
New Contributor
I am adding three layers to a map in this order:

basemap = new esri.layers.ArcGISTiledMapServiceLayer(basemapURL); map.addLayer(basemap);  kml = new esri.layers.KMLLayer(kmlUrl);  map.addLayer(kml);  dataLayer = new esri.layers.GraphicsLayer(); map.addLayer(dataLayer);


When I print the layer.id for each I get the following:
dataLayer = graphicsLayer2
kml = layer1
basemap = layer0

I want my dataLayer to be the top layer but it seems no matter what I do the kml layer is on top.  I tried reorderLayer and put the graphics layer in index 2 and still same result.  How can I display the real order of all layers in a map and get my dataLayer on top?
0 Kudos
1 Solution

Accepted Solutions
derekswingley1
Frequent Contributor II
You're passing your kmlLayer object to map.reorderLayer(). To make this work, you have to pass the actual graphics layer or feature layer to reorderLayer. Here's a working example:  http://jsfiddle.net/swingley/BuPYY/

The code there does the following:
-adds a graphics layer with a single graphic
-adds a kml layer
-when the kml loads, get the layers that make up the kml layer
-add a listener on the feature layer that makes up the kml layer's graphics onUpdate
-when onUpdate fires, reorder the layers
-disconnect the onUpdate listener after it fires once

We need to wait for onUpdate because that fires once all the graphics are present.

View solution in original post

0 Kudos
11 Replies
AndyGup
Esri Regular Contributor
Try explicitly setting the layer index using the optional 'index' property in the addLayer(layer, index?) method.

http://help.arcgis.com/en/webapi/javascript/arcgis/help/jsapi/map.htm#addLayer

-Andy
Esri Developer Network
0 Kudos
DanRicketts
New Contributor
Try explicitly setting the layer index using the optional 'index' property in the addLayer(layer, index?) method.

http://help.arcgis.com/en/webapi/javascript/arcgis/help/jsapi/map.htm#addLayer

-Andy
Esri Developer Network


Andy,
It seems no matter what I do the kml layer stays on top.  I tried using the index and it still had the kml layer on top.  I added another graphics layer and was able to reorder them with reorderLayer fine.  When I try to reorder the kml layer it refuses to change position.  I added another dynamictiled layer and that reordered with the graphics layers just fine, but still the KML layer was on top and would not move.  Is this a bug with the kml layer perhaps?

Thanks,
0 Kudos
derekswingley1
Frequent Contributor II
It seems no matter what I do the kml layer stays on top.  I tried using the index and it still had the kml layer on top.  I added another graphics layer and was able to reorder them with reorderLayer fine.  When I try to reorder the kml layer it refuses to change position.  I added another dynamictiled layer and that reordered with the graphics layers just fine, but still the KML layer was on top and would not move.  Is this a bug with the kml layer perhaps?


Depending on what's in your KML file, the resulting KML Layer can contain one or more additional layers. We touch on this in the Working with KML Layers conceptual help topic.

If you need to reorder layers from a KML Layer, use the KMLLayer's getLayers method. Once you have the layers that make up your KMLLayer, you can reorder them using map.reorderLayer().
0 Kudos
DanRicketts
New Contributor
Depending on what's in your KML file, the resulting KML Layer can contain one or more additional layers. We touch on this in the Working with KML Layers conceptual help topic.

If you need to reorder layers from a KML Layer, use the KMLLayer's getLayers method. Once you have the layers that make up your KMLLayer, you can reorder them using map.reorderLayer().


Derek,
Thanks for the response.  I tried getting the kml layers as noted in the above links but the array seems to be empty...  I tried:
console.log(kml.getLayers);

and got
function (){var _13=[];if(this._groundLyr){_13.push(this._groundLyr);}if(this._fLayers){_13=_13.concat(this._fLayers);}if(this._links){_4.forEach(this._links,function(_14){if(_14.declaredClass){_13.push(_14);}});}return _13;}
Then I tried to get the length of the array with
var kmlLayers = kml.getLayers();
console.log("KML Array Length ="+kmlLayers.length);

and got
KML Array Length =0
Then I tried
console.log(kml.getLayers());

and got an empty array []

If there are layers in the kml I can't get to them.  The kmlurl I am using to construct the kml layer is http://geocommons.com/overlays/11433.kml

Any other suggestions would be appreciated.  In the meantime I will create a simple shape and export as kml in arcmap and see if I can get layers in that.

Thanks again,
0 Kudos
derekswingley1
Frequent Contributor II
Are you running the console statements after the kml layer loads? Try something like:

dojo.connect(kml, "onLoad", function(kmlLayer) {
  console.log("Number of layers in kml layer: ", kmlLayer.getLayers().length);
});


One other thing- your KML file is ~8MB. We recommend that you don't go over a couple of MB for performance reasons. For me, using JSFiddle, your layer takes 10-15 seconds to show up. Example:  http://jsfiddle.net/swingley/JWqHv/
0 Kudos
DanRicketts
New Contributor
Are you running the console statements after the kml layer loads? Try something like:

dojo.connect(kml, "onLoad", function(kmlLayer) {
  console.log("Number of layers in kml layer: ", kmlLayer.getLayers().length);
});



Derek,
Thanks for the tips.  I now wait for the layer to load as above and I get 1 layer.  I still can't get the graphics layers on top of the kml layer.  It is like the kml layer refuses to reorder. 
dojo.connect(kml, 'onLoad', function(kmlLayers) {
  console.log("DEBUG: Loaded KML File");
  console.log("Number of Kml Layers "+kmlLayers.getLayers().length+" Layer ID = "+kmlLayers.id);
  console.log(kmlLayers.getLayers());
  map.reorderLayer(kmlLayers, 0);
  console.log("Graphics Layers "+map.graphicsLayerIds);
  console.log("Layers "+map.layerIds);
    });


Yeilds this:
Number of Kml Layers 1 Layer ID = layer1

Graphics Layers graphicsLayer3,graphicsLayer2
Layers layer1,layer0

I have tried putting it in position 1 and calling the layer kml in the reorder as well and it still stays on top.  I can reorder the two graphics layers fine but not the KML layer.  Any other thoughts on how to get KML layer under the graphics layers?

As an additional note when I expand the array in the console this is some of the information:
id: "graphicsLayer4"
indexedFields: undefined
infoTemplate: i
isDataVersioned: undefined
layerId: undefined
0 Kudos
derekswingley1
Frequent Contributor II
You're passing your kmlLayer object to map.reorderLayer(). To make this work, you have to pass the actual graphics layer or feature layer to reorderLayer. Here's a working example:  http://jsfiddle.net/swingley/BuPYY/

The code there does the following:
-adds a graphics layer with a single graphic
-adds a kml layer
-when the kml loads, get the layers that make up the kml layer
-add a listener on the feature layer that makes up the kml layer's graphics onUpdate
-when onUpdate fires, reorder the layers
-disconnect the onUpdate listener after it fires once

We need to wait for onUpdate because that fires once all the graphics are present.

View solution in original post

0 Kudos
DanRicketts
New Contributor
You're passing your kmlLayer object to map.reorderLayer(). To make this work, you have to pass the actual graphics layer or feature layer to reorderLayer. Here's a working example:  http://jsfiddle.net/swingley/BuPYY/

We need to wait for onUpdate because that fires once all the graphics are present.


Derek,
Excellent.  It is now working and reordering fine.  I was not catching the difference between the kml Layer that I added and the graphics layer that was in the kml layer.  I was thinking that one layer was one in the same.  Thanks for the solution. 

As a side note, does esri have a different solution if we need these larger kml files?  I understand it will take longer to load but if we need the data there is not a way around the larger file.  If this is a separate thread that is fine but in case it is a quick explanation.
0 Kudos
derekswingley1
Frequent Contributor II
Good stuff, glad it's working. It's a bit confusing but the JS API uses multiple layers to represent features from a KML file. This is necessary due to the diverse of types of features you can put in KML.

Regarding large KML files:  ideally you would serve your large data sets using ArcGIS Server, probably as a dynamic map service.
0 Kudos