Filter geohash_grid aggregation to map view box with collar

src/core_plugins/tile_map/public/__tests__/kibana_map.js

@@ -63,10 +63,33 @@ describe('kibana_map tests', function () {
 
       expect(kibanaMap.getCenter().lon).to.equal(0);
       expect(kibanaMap.getCenter().lat).to.equal(0);
-      const bounds = kibanaMap.getBounds();
-      expect(bounds.bottom_right.lon).to.equal(180);
-      expect(bounds.top_left.lon).to.equal(-180);
+    });
+
+  });
+
+  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
+      });
+    });
+
+    afterEach(function () {
+      kibanaMap.destroy();
+      teardownDOM();
+    });
 
+    it('should get untrimmed map bounds', function () {
+      const bounds = kibanaMap.getUntrimmedBounds(false);
+      expect(bounds.bottom_right.lon).to.equal(281.25);
+      expect(bounds.top_left.lon).to.equal(-281.25);
     });
   });
 

src/core_plugins/tile_map/public/geohash_layer.js

@@ -25,6 +25,7 @@ export class GeohashLayer extends KibanaMapLayer {
 
   _createGeohashMarkers() {
     const markerOptions = {
+      isFilteredByCollar: this._geohashOptions.isFilteredByCollar,
       valueFormatter: this._geohashOptions.valueFormatter,
       tooltipFormatter: this._geohashOptions.tooltipFormatter
     };
@@ -65,22 +66,34 @@ export class GeohashLayer extends KibanaMapLayer {
     this._geohashMarkers.movePointer(...args);
   }
 
-  getBounds() {
+  async getBounds() {
+    if (this._geohashOptions.fetchBounds) {
+      const geoHashBounds = await this._geohashOptions.fetchBounds();
+      if (geoHashBounds) {
+        const northEast = L.latLng(geoHashBounds.top_left.lat, geoHashBounds.bottom_right.lon);
+        const southWest = L.latLng(geoHashBounds.bottom_right.lat, geoHashBounds.top_left.lon);
+        const leaftetBounds = L.latLngBounds(southWest, northEast);
+        return leaftetBounds;
+      }
+    }
+
     return this._bounds;
   }
 
   updateExtent() {
-    const bounds = this._kibanaMap.getLeafletBounds();
-    if (!this._lastBounds || !this._lastBounds.equals(bounds)) {
-      //this removal is required to trigger the bounds filter again
-      this._kibanaMap.removeLayer(this);
-      this._createGeohashMarkers();
-      this._kibanaMap.addLayer(this);
+    // Client-side filtering is only enabled when server-side filter is not used
+    if (!this._geohashOptions.isFilteredByCollar) {
+      const bounds = this._kibanaMap.getLeafletBounds();
+      if (!this._lastBounds || !this._lastBounds.equals(bounds)) {
+        //this removal is required to trigger the bounds filter again
+        this._kibanaMap.removeLayer(this);
+        this._createGeohashMarkers();
+        this._kibanaMap.addLayer(this);
+      }
+      this._lastBounds = bounds;
     }
-    this._lastBounds = bounds;
   }
 
-
   isReusable(options) {
 
     if (_.isEqual(this._geohashOptions, options)) {

src/core_plugins/tile_map/public/kibana_map.js

@@ -96,7 +96,6 @@ export class KibanaMap extends EventEmitter {
     this._listeners = [];
     this._showTooltip = false;
 
-
     const leafletOptions = {
       minZoom: options.minZoom,
       maxZoom: options.maxZoom,
@@ -178,8 +177,6 @@ export class KibanaMap extends EventEmitter {
     });
 
     this.resize();
-
-
   }
 
   setShowTooltip(showTooltip) {
@@ -377,6 +374,36 @@ export class KibanaMap extends EventEmitter {
     };
   }
 
+  getUntrimmedBounds() {
+    const bounds = this._leafletMap.getBounds();
+    if (!bounds) {
+      return null;
+    }
+
+    const southEast = bounds.getSouthEast();
+    const northWest = bounds.getNorthWest();
+    const southEastLng = southEast.lng;
+    const northWestLng = northWest.lng;
+    const southEastLat = southEast.lat;
+    const northWestLat = northWest.lat;
+
+    //Bounds cannot be created unless they form a box with larger than 0 dimensions
+    //Invalid areas are rejected by ES.
+    if (southEastLat === northWestLat || southEastLng === northWestLng) {
+      return;
+    }
+
+    return {
+      bottom_right: {
+        lat: southEastLat,
+        lon: southEastLng
+      },
+      top_left: {
+        lat: northWestLat,
+        lon: northWestLng
+      }
+    };
+  }
 
   setDesaturateBaseLayer(isDesaturated) {
     if (isDesaturated === this._baseLayerIsDesaturated) {
@@ -513,15 +540,18 @@ export class KibanaMap extends EventEmitter {
     return mapBounds.intersects(bucketRectBounds);
   }
 
-  fitToData() {
+  async fitToData() {
 
     if (!this._leafletMap) {
       return;
     }
 
+    const boundsArray = await Promise.all(this._layers.map(async (layer) => {
+      return await layer.getBounds();
+    }));
+
     let bounds = null;
-    this._layers.forEach(layer => {
-      const b = layer.getBounds();
+    boundsArray.forEach(async (b) => {
       if (bounds) {
         bounds.extend(b);
       } else {
@@ -582,6 +612,7 @@ export class KibanaMap extends EventEmitter {
       if (!centerFromUIState || centerFromMap.lon !== centerFromUIState[1] || centerFromMap.lat !== centerFromUIState[0]) {
         visualization.uiStateVal('mapCenter', [centerFromMap.lat, centerFromMap.lon]);
       }
+      uiState.set('mapBounds', this.getUntrimmedBounds());
     }
 
     this.on('dragend', persistMapStateInUiState);

src/core_plugins/tile_map/public/kibana_map_layer.js

@@ -7,7 +7,7 @@ export class KibanaMapLayer extends EventEmitter {
     this._leafletLayer = null;
   }
 
-  getBounds() {
+  async getBounds() {
     return this._leafletLayer.getBounds();
   }
 

src/core_plugins/tile_map/public/maps_visualization.js

@@ -4,14 +4,18 @@ import $ from 'jquery';
 import _ from 'lodash';
 import { KibanaMap } from './kibana_map';
 import { GeohashLayer } from './geohash_layer';
+import { SearchSourceProvider } from 'ui/courier/data_source/search_source';
+import { VisAggConfigProvider } from 'ui/vis/agg_config';
 // import './lib/service_settings';
 import 'ui/vis/map/service_settings';
 import './styles/_tilemap.less';
 
 
-export function MapsVisualizationProvider(serviceSettings, Notifier, getAppState) {
+export function MapsVisualizationProvider(serviceSettings, Notifier, getAppState, Private) {
 
+  const AggConfig = Private(VisAggConfigProvider);
   const notify = new Notifier({ location: 'Coordinate Map' });
+  const SearchSource = Private(SearchSourceProvider);
 
   class MapsVisualization {
 
@@ -43,6 +47,7 @@ export function MapsVisualizationProvider(serviceSettings, Notifier, getAppState
         if (esResponse && typeof esResponse.geohashGridAgg === 'undefined') {
           return resolve();
         }
+
         if (status.data) {
           this._recreateGeohashLayer(esResponse);
         }
@@ -52,6 +57,7 @@ export function MapsVisualizationProvider(serviceSettings, Notifier, getAppState
         if (status.resize) {
           this._kibanaMap.resize();
         }
+
         this._doRenderComplete(resolve);
 
       });
@@ -82,6 +88,8 @@ export function MapsVisualizationProvider(serviceSettings, Notifier, getAppState
       options.center = centerFromUIState ? centerFromUIState : this.vis.type.visConfig.defaults.mapCenter;
 
       this._kibanaMap = new KibanaMap(containerElement, options);
+      uiState.set('mapZoom', this._kibanaMap.getZoomLevel());
+      uiState.set('mapBounds', this._kibanaMap.getUntrimmedBounds());
       this._kibanaMap.addDrawControl();
       this._kibanaMap.addFitControl();
       this._kibanaMap.addLegendControl();
@@ -92,7 +100,10 @@ export function MapsVisualizationProvider(serviceSettings, Notifier, getAppState
       this._kibanaMap.on('zoomchange', () => {
         precisionChange = (previousPrecision !== this._kibanaMap.getAutoPrecision());
         previousPrecision = this._kibanaMap.getAutoPrecision();
-        this.vis.aggs[1].params.precision = previousPrecision;
+        const agg = this._getGeoHashAgg();
+        if (agg) {
+          agg.params.precision = previousPrecision;
+        }
       });
       this._kibanaMap.on('zoomend', () => {
 
@@ -233,6 +244,8 @@ export function MapsVisualizationProvider(serviceSettings, Notifier, getAppState
         valueFormatter: this._chartData ? this._chartData.valueFormatter : null,
         tooltipFormatter: this._chartData ? this._chartData.tooltipFormatter : null,
         mapType: newParams.mapType,
+        isFilteredByCollar: this._isFilteredByCollar(),
+        fetchBounds: this.getGeohashBounds.bind(this),
         heatmap: {
           heatBlur: newParams.heatBlur,
           heatMaxZoom: newParams.heatMaxZoom,
@@ -266,10 +279,47 @@ export function MapsVisualizationProvider(serviceSettings, Notifier, getAppState
       this.vis.updateState();
     }
 
-  }
+    async getGeohashBounds() {
+      const agg = this._getGeoHashAgg();
+      if (agg) {
+        const searchSource = new SearchSource();
+        searchSource.index(this.vis.indexPattern);
+        searchSource.size(0);
+        searchSource.aggs(function () {
+          const geoBoundsAgg = new AggConfig(agg.vis, {
+            type: 'geo_bounds',
+            enabled:true,
+            params: {
+              field: agg.getField()
+            },
+            schema: 'metric'
+          });
+          return {
+            '1': geoBoundsAgg.toDsl()
+          };
+        });
+        const esResp = await searchSource.fetch();
+        return _.get(esResp, 'aggregations.1.bounds');
+      }
+    }
 
+    _getGeoHashAgg() {
+      return this.vis.aggs.find((agg) => {
+        return agg.type.dslName === 'geohash_grid';
+      });
+    }
 
+    _isFilteredByCollar() {
+      const DEFAULT = false;
 
+      const agg = this._getGeoHashAgg();
+      if (agg) {
+        return _.get(agg, 'params.isFilteredByCollar', DEFAULT);
+      } else {
+        return DEFAULT;
+      }
+    }
+  }
 
   return MapsVisualization;
 }

src/core_plugins/tile_map/public/markers/scaled_circles.js

@@ -18,17 +18,23 @@ export class ScaledCirclesMarkers extends EventEmitter {
     this._legendQuantizer = null;
 
     this._popups = [];
-    this._leafletLayer = L.geoJson(null, {
+
+    const layerOptions = {
       pointToLayer: this.getMarkerFunction(),
       style: this.getStyleFunction(),
       onEachFeature: (feature, layer) => {
         this._bindPopup(feature, layer);
-      },
-      filter: (feature) => {
+      }
+    };
+    // Filter leafletlayer on client when results are not filtered on the server
+    if (!options.isFilteredByCollar) {
+      layerOptions.filter = (feature) => {
         const bucketRectBounds = _.get(feature, 'properties.rectangle');
         return kibanaMap.isInside(bucketRectBounds);
-      }
-    });
+      };
+    }
+    this._leafletLayer = L.geoJson(null, layerOptions);
+
     this._leafletLayer.addData(this._geohashGeoJson);
   }
 

src/ui/public/agg_response/tabify/__tests__/_buckets.js

@@ -58,4 +58,15 @@ describe('Buckets wrapper', function () {
 
     test(aggResp, count, keys);
   });
+
+  describe('with single bucket aggregations (filter)', function () {
+    it('creates single bucket from agg content', function () {
+      const aggResp = {
+        single_bucket: {},
+        doc_count: 5
+      };
+      const buckets = new Buckets(aggResp);
+      expect(buckets).to.have.length(1);
+    });
+  });
 });

src/ui/public/agg_response/tabify/_buckets.js

@@ -1,11 +1,17 @@
 import _ from 'lodash';
 
 export function AggResponseBucketsProvider() {
+
   function Buckets(aggResp) {
-    aggResp = aggResp || false;
-    this.buckets = aggResp.buckets || [];
-    this.objectMode = _.isPlainObject(this.buckets);
+    if (_.has(aggResp, 'buckets')) {
+      this.buckets = aggResp.buckets;
+    } else {
+      // Some Bucket Aggs only return a single bucket (like filter).
+      // In those instances, the aggResp is the content of the single bucket.
+      this.buckets = [aggResp];
+    }
 
+    this.objectMode = _.isPlainObject(this.buckets);
     if (this.objectMode) {
       this._keys = _.keys(this.buckets);
       this.length = this._keys.length;