Open
Description
My UI allows the user to select which layers they want on the left and right for comparison. This can result in the user selecting the same layer for both sides, even if just temporarily while they are making selections. The side-by-side control does not support this correctly, and typically the left side will be blanked (because there is just one layer, and the right side clip is set last, so it "wins").
The following simple fix removes the clip area from the layer if the left and right layers are the same.
_updateClip: function () {
var map = this._map
var nw = map.containerPointToLayerPoint([0, 0])
var se = map.containerPointToLayerPoint(map.getSize())
var clipX = nw.x + this.getPosition()
var dividerX = this.getPosition()
this._divider.style.left = dividerX + 'px'
this.fire('dividermove', {x: dividerX})
if (this._leftLayer === this._rightLayer && this._leftLayer) {
this._leftLayer.getContainer().style.clip = '';
this._rightLayer.getContainer().style.clip = '';
} else {
var clipLeft = 'rect(' + [nw.y, clipX, se.y, nw.x].join('px,') + 'px)'
var clipRight = 'rect(' + [nw.y, se.x, se.y, clipX].join('px,') + 'px)'
if (this._leftLayer) {
this._leftLayer.getContainer().style.clip = clipLeft
}
if (this._rightLayer) {
this._rightLayer.getContainer().style.clip = clipRight
}
}
},
Metadata
Metadata
Assignees
Labels
No labels