Skip to content

Commit

Permalink
Map filter not set appropriately when spy panel is open (elastic#13678)
Browse files Browse the repository at this point in the history 
* get dimensions from parent elements when map has not height or width

* clean up test variable names
  • Loading branch information
@nreese @chrisronline
nreese authored and chrisronline committed Dec 1, 2017
1 parent de5863e commit d6fd193
Show file tree
Hide file tree
Showing 2 changed files with 120 additions and 35 deletions.
110 changes: 82 additions & 28 deletions src/core_plugins/tile_map/public/__tests__/kibana_map.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,14 +8,19 @@ describe('kibana_map tests', function () {
let domNode;
let kibanaMap;

function setupDOM() {
domNode = document.createElement('div');
domNode.style.top = '0';
domNode.style.left = '0';
domNode.style.width = '512px';
domNode.style.height = '512px';
domNode.style.position = 'fixed';
domNode.style['pointer-events'] = 'none';
function createDiv(width, height) {
const div = document.createElement('div');
div.style.top = '0';
div.style.left = '0';
div.style.width = width;
div.style.height = height;
div.style.position = 'fixed';
div.style['pointer-events'] = 'none';
return div;
}

function setupDOM(width, height) {
domNode = createDiv(width, height);
document.body.appendChild(domNode);
}

Expand All @@ -28,7 +33,7 @@ describe('kibana_map tests', function () {
describe('KibanaMap - basics', function () {

beforeEach(async function () {
setupDOM();
setupDOM('512px', '512px');
kibanaMap = new KibanaMap(domNode, {
minZoom: 1,
maxZoom: 10,
Expand Down Expand Up @@ -67,38 +72,86 @@ describe('kibana_map tests', function () {

});

describe('KibanaMap - getUntrimmedBounds', function () {

beforeEach(async function () {
setupDOM();
domNode.style.width = '1600px';
domNode.style.height = '1024px';
kibanaMap = new KibanaMap(domNode, {
minZoom: 1,
maxZoom: 10,
center: [0,0],
zoom: 2
});
});
describe('getUntrimmedBounds', function () {

afterEach(function () {
kibanaMap.destroy();
teardownDOM();
});

it('should get untrimmed map bounds', function () {
const bounds = kibanaMap.getUntrimmedBounds(false);
expect(bounds.bottom_right.lon.toFixed(2)).to.equal('281.25');
expect(bounds.top_left.lon.toFixed(2)).to.equal('-281.25');
describe('extended bounds', function () {
beforeEach(async function () {
setupDOM('1600px', '1024px');
kibanaMap = new KibanaMap(domNode, {
minZoom: 1,
maxZoom: 10,
center: [0,0],
zoom: 2
});
});

it('should get untrimmed map bounds', function () {
const bounds = kibanaMap.getUntrimmedBounds();
expect(bounds.bottom_right.lon.toFixed(2)).to.equal('281.25');
expect(bounds.top_left.lon.toFixed(2)).to.equal('-281.25');
});
});

describe('no map height', function () {
beforeEach(async function () {
setupDOM('386px', '256px');
const noHeightNode = createDiv('386px', '0px');
domNode.appendChild(noHeightNode);
kibanaMap = new KibanaMap(noHeightNode, {
minZoom: 1,
maxZoom: 10,
center: [0,0],
zoom: 10
});
});

it('should calculate map dimensions based on parent element dimensions', function () {
const bounds = kibanaMap.getUntrimmedBounds();
expect(bounds).to.have.property('bottom_right');
expect(bounds.bottom_right.lon.toFixed(2)).to.equal('0.27');
expect(bounds.bottom_right.lat.toFixed(2)).to.equal('-0.18');
expect(bounds).to.have.property('top_left');
expect(bounds.top_left.lon.toFixed(2)).to.equal('-0.27');
expect(bounds.top_left.lat.toFixed(2)).to.equal('0.18');
});
});

describe('no map width', function () {
beforeEach(async function () {
setupDOM('386px', '256px');
const noWidthNode = createDiv('0px', '256px');
domNode.appendChild(noWidthNode);
kibanaMap = new KibanaMap(noWidthNode, {
minZoom: 1,
maxZoom: 10,
center: [0,0],
zoom: 10
});
});

it('should calculate map dimensions based on parent element dimensions', function () {
const bounds = kibanaMap.getUntrimmedBounds();
expect(bounds).to.have.property('bottom_right');
expect(bounds.bottom_right.lon.toFixed(2)).to.equal('0.27');
expect(bounds.bottom_right.lat.toFixed(2)).to.equal('-0.18');
expect(bounds).to.have.property('top_left');
expect(bounds.top_left.lon.toFixed(2)).to.equal('-0.27');
expect(bounds.top_left.lat.toFixed(2)).to.equal('0.18');
});
});
});


describe('KibanaMap - attributions', function () {


beforeEach(async function () {
setupDOM();
setupDOM('512px', '512px');
kibanaMap = new KibanaMap(domNode, {
minZoom: 1,
maxZoom: 10,
Expand Down Expand Up @@ -138,10 +191,11 @@ describe('kibana_map tests', function () {

});


describe('KibanaMap - baseLayer', function () {

beforeEach(async function () {
setupDOM();
setupDOM('512px', '512px');
kibanaMap = new KibanaMap(domNode, {
minZoom: 1,
maxZoom: 10,
Expand Down
45 changes: 38 additions & 7 deletions src/core_plugins/tile_map/public/kibana_map.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -398,15 +398,46 @@ export class KibanaMap extends EventEmitter {

const southEast = bounds.getSouthEast();
const northWest = bounds.getNorthWest();
const southEastLng = southEast.lng;
const northWestLng = northWest.lng;
const southEastLat = southEast.lat;
const northWestLat = northWest.lat;
let southEastLng = southEast.lng;
let northWestLng = northWest.lng;
let southEastLat = southEast.lat;
let northWestLat = northWest.lat;

//Bounds cannot be created unless they form a box with larger than 0 dimensions
//Invalid areas are rejected by ES.
// When map has not width or height, calculate map dimensions based on parent dimensions
if (southEastLat === northWestLat || southEastLng === northWestLng) {
return;
let parent = this._containerNode.parentElement;
while (parent && (parent.clientWidth === 0 || parent.clientHeight === 0)) {
parent = parent.parentNode;
}
let width = 512;
let height = 512;
if (parent && parent.clientWidth !== 0) {
width = parent.clientWidth;
}
if (parent && parent.clientHeight !== 0) {
height = parent.clientHeight;
}

let top = 0;
let left = 0;
let bottom = height;
let right = width;
// no height - top is center of map and needs to be adjusted
if (southEastLat === northWestLat) {
top = height / 2 * -1;
bottom = height / 2;
}
// no width - left is center of map and needs to be adjusted
if (southEastLng === northWestLng) {
left = width / 2 * -1;
right = width / 2;
}
const containerSouthEast = this._leafletMap.layerPointToLatLng(L.point(right, bottom));
const containerNorthWest = this._leafletMap.layerPointToLatLng(L.point(left, top));
southEastLng = containerSouthEast.lng;
northWestLng = containerNorthWest.lng;
southEastLat = containerSouthEast.lat;
northWestLat = containerNorthWest.lat;
}

return {
Expand Down

0 comments on commit d6fd193

Please sign in to comment.