implement view in maps button

elastic · Jul 14, 2021 · 7c3f745 · 7c3f745
1 parent ebbb79f
commit 7c3f745
Show file tree

Hide file tree

Showing 3 changed files with 57 additions and 33 deletions.
diff --git a/x-pack/plugins/maps/public/legacy_visualizations/tile_map/tile_map_editor.tsx b/x-pack/plugins/maps/public/legacy_visualizations/tile_map/tile_map_editor.tsx
@@ -7,8 +7,10 @@
 
 import React, { Component } from 'react';
 import { i18n } from '@kbn/i18n';
+import { Vis } from '../../../../../../src/plugins/visualizations/public';
+import { getData, getShareService } from '../../kibana_services';
 import { ViewInMaps } from '../view_in_maps';
-import { COORDINATE_MAP_TITLE } from './utils';
+import { COORDINATE_MAP_TITLE, extractLayerDescriptorParams } from './utils';
 
 interface Props {
   vis: Vis;
@@ -30,7 +32,23 @@ export class TileMapEditor extends Component<{}, State> {
     this._isMounted = false;
   }
 
+  _onClick = (e: React.MouseEvent<HTMLButtonElement>) => {
+    e.preventDefault();
+
+    const locator = getShareService().url.locators.get('MAPS_APP_TILE_MAP_LOCATOR');
+    if (!locator) return;
+
+    const query = getData().query;
+    locator.navigate({
+      ...(extractLayerDescriptorParams(this.props.vis)),
+      filters: query.filterManager.getFilters(),
+      query: query.queryString.getQuery(),
+      timeRange: query.timefilter.timefilter.getTime(),
+    });
+
+  }
+
   render() {
-    return <ViewInMaps onClick={() => {}} visualizationLabel={COORDINATE_MAP_TITLE} />;
+    return <ViewInMaps onClick={this._onClick} visualizationLabel={COORDINATE_MAP_TITLE} />;
   }
 }
diff --git a/x-pack/plugins/maps/public/legacy_visualizations/tile_map/to_ast.ts b/x-pack/plugins/maps/public/legacy_visualizations/tile_map/to_ast.ts
@@ -10,45 +10,17 @@ import { buildExpression, buildExpressionFunction } from '../../../../../../src/
 import { VisToExpressionAst } from '../../../../../../src/plugins/visualizations/public';
 import { TileMapExpressionFunctionDefinition } from './tile_map_fn';
 import { TileMapVisParams } from './types';
+import { extractLayerDescriptorParams } from './utils';
 
 export const toExpressionAst: VisToExpressionAst<TileMapVisParams> = (vis) => {
-  const params: { [key: string]: any } = {
-    label: vis.title ? vis.title : title,
-    mapType: vis.params.mapType,
-    colorSchema: vis.params.colorSchema,
-    indexPatternId: vis.data.indexPattern?.id,
-    metricAgg: 'count',
-  };
-
-  const bucketAggs = vis.data?.aggs?.byType('buckets');
-  if (bucketAggs?.length && bucketAggs[0].type.dslName === 'geohash_grid') {
-    params.geoFieldName = bucketAggs[0].getField()?.name;
-  } else if (vis.data.indexPattern) {
-    // attempt to default to first geo point field when geohash is not configured yet
-    const geoField = vis.data.indexPattern.fields.find((field) => {
-      return (
-        !indexPatterns.isNestedField(field) && field.aggregatable && field.type === 'geo_point'
-      );
-    });
-    if (geoField) {
-      params.geoFieldName = geoField.name;
-    }
-  }
-
-  const metricAggs = vis.data?.aggs?.byType('metrics');
-  if (metricAggs?.length) {
-    params.metricAgg = metricAggs[0].type.dslName;
-    params.metricFieldName = metricAggs[0].getField()?.name;
-  }
-
   const tileMap = buildExpressionFunction<TileMapExpressionFunctionDefinition>(
     'tilemap',
     {
       visConfig: JSON.stringify({
         ...vis.params,
         mapCenter: vis.uiState.get('mapCenter', [0, 0]),
         mapZoom: parseInt(vis.uiState.get('mapZoom', 2), 10),
-        layerDescriptorParams: params,
+        layerDescriptorParams: extractLayerDescriptorParams(vis),
       }),
     }
   );

diff --git a/x-pack/plugins/maps/public/legacy_visualizations/tile_map/utils.ts b/x-pack/plugins/maps/public/legacy_visualizations/tile_map/utils.ts
@@ -6,7 +6,41 @@
  */
 
 import { i18n } from '@kbn/i18n';
+import { Vis } from '../../../../../../src/plugins/visualizations/public';
 
 export const COORDINATE_MAP_TITLE = i18n.translate('xpack.maps.legacyVisualizations.tileMapTitle', {
   defaultMessage: 'Coordinate Map',
-});
+});
+
+export function extractLayerDescriptorParams(vis: Vis) {
+  const params: { [key: string]: any } = {
+    label: vis.title ? vis.title : COORDINATE_MAP_TITLE,
+    mapType: vis.params.mapType,
+    colorSchema: vis.params.colorSchema,
+    indexPatternId: vis.data.indexPattern?.id,
+    metricAgg: 'count',
+  };
+
+  const bucketAggs = vis.data?.aggs?.byType('buckets');
+  if (bucketAggs?.length && bucketAggs[0].type.dslName === 'geohash_grid') {
+    params.geoFieldName = bucketAggs[0].getField()?.name;
+  } else if (vis.data.indexPattern) {
+    // attempt to default to first geo point field when geohash is not configured yet
+    const geoField = vis.data.indexPattern.fields.find((field) => {
+      return (
+        !indexPatterns.isNestedField(field) && field.aggregatable && field.type === 'geo_point'
+      );
+    });
+    if (geoField) {
+      params.geoFieldName = geoField.name;
+    }
+  }
+
+  const metricAggs = vis.data?.aggs?.byType('metrics');
+  if (metricAggs?.length) {
+    params.metricAgg = metricAggs[0].type.dslName;
+    params.metricFieldName = metricAggs[0].getField()?.name;
+  }
+
+  return params;
+}