Merge pull request Esri#1084 from appleshowc/appleshowc-patch-1

Add setZIndex function to dynamic/imageMapLayer
jgravois · Aug 2, 2018 · 6cf0160 · 6cf0160
2 parents 4fa02ce + 8c476ef
commit 6cf0160
Showing 1 changed file with 39 additions and 1 deletion.
diff --git a/src/Layers/RasterLayer.js b/src/Layers/RasterLayer.js
@@ -31,6 +31,10 @@ export var RasterLayer = Layer.extend({
     // include 'Powered by Esri' in map attribution
     setEsriAttribution(map);
 
+    if (this.options.zIndex) {
+      this.options.position = null;
+    }
+
     this._update = Util.throttle(this._update, this.options.updateInterval, this);
 
     map.on('moveend', this._update, this);
@@ -99,6 +103,7 @@ export var RasterLayer = Layer.extend({
     this.options.position = 'front';
     if (this._currentImage) {
       this._currentImage.bringToFront();
+      this._setAutoZIndex(Math.max);
     }
     return this;
   },
@@ -107,10 +112,39 @@ export var RasterLayer = Layer.extend({
     this.options.position = 'back';
     if (this._currentImage) {
       this._currentImage.bringToBack();
+      this._setAutoZIndex(Math.min);
     }
     return this;
   },
 
+  setZIndex: function (value) {
+    this.options.zIndex = value;
+    if (this._currentImage) {
+      this._currentImage.setZIndex(value);
+    }
+    return this;
+  },
+
+  _setAutoZIndex: function (compare) {
+    // go through all other layers of the same pane, set zIndex to max + 1 (front) or min - 1 (back)
+    if (!this._currentImage) {
+      return;
+    }
+    var layers = this._currentImage.getPane().children;
+    var edgeZIndex = -compare(-Infinity, Infinity); // -Infinity for max, Infinity for min
+    for (var i = 0, len = layers.length, zIndex; i < len; i++) {
+      zIndex = layers[i].style.zIndex;
+      if (layers[i] !== this._currentImage._image && zIndex) {
+        edgeZIndex = compare(edgeZIndex, +zIndex);
+      }
+    }
+
+    if (isFinite(edgeZIndex)) {
+      this.options.zIndex = edgeZIndex + compare(-1, 1);
+      this.setZIndex(this.options.zIndex);
+    }
+  },
+
   getAttribution: function () {
     return this.options.attribution;
   },
@@ -194,10 +228,14 @@ export var RasterLayer = Layer.extend({
 
             if (this.options.position === 'front') {
               this.bringToFront();
-            } else {
+            } else if (this.options.position === 'back') {
               this.bringToBack();
             }
 
+            if (this.options.zIndex) {
+              this.setZIndex(this.options.zIndex);
+            }
+
             if (this._map && this._currentImage._map) {
               this._currentImage.setOpacity(this.options.opacity);
             } else {