move tile map visualization out of vislib

src/core_plugins/kbn_vislib_vis_types/public/tile_map.js

@@ -1,17 +1,17 @@
 import _ from 'lodash';
 import supports from 'ui/utils/supports';
-import VislibVisTypeVislibVisTypeProvider from 'ui/vislib_vis_type/vislib_vis_type';
+import MapsVisTypeVislibVisTypeProvider from 'ui/vis_maps/maps_vis_type';
 import VisSchemasProvider from 'ui/vis/schemas';
 import AggResponseGeoJsonGeoJsonProvider from 'ui/agg_response/geo_json/geo_json';
 import FilterBarPushFilterProvider from 'ui/filter_bar/push_filter';
 import tileMapTemplate from 'plugins/kbn_vislib_vis_types/editors/tile_map.html';
 
 export default function TileMapVisType(Private, getAppState, courier, config) {
-  const VislibVisType = Private(VislibVisTypeVislibVisTypeProvider);
+  const MapsVisType = Private(MapsVisTypeVislibVisTypeProvider);
   const Schemas = Private(VisSchemasProvider);
   const geoJsonConverter = Private(AggResponseGeoJsonGeoJsonProvider);
 
-  return new VislibVisType({
+  return new MapsVisType({
     name: 'tile_map',
     title: 'Tile map',
     icon: 'fa-map-marker',

src/core_plugins/kibana/public/visualize/editor/nesting_indicator.js

@@ -1,6 +1,6 @@
 import _ from 'lodash';
 import $ from 'jquery';
-import VislibComponentsColorColorPaletteProvider from 'ui/vislib/components/color/color_palette';
+import VislibComponentsColorColorPaletteProvider from 'ui/vis/components/color/color_palette';
 import uiModules from 'ui/modules';
 uiModules
 .get('kibana')

src/core_plugins/tagcloud/public/tag_cloud.js

@@ -1,6 +1,6 @@
 import d3 from 'd3';
 import d3TagCloud from 'd3-cloud';
-import vislibComponentsSeedColorsProvider from 'ui/vislib/components/color/seed_colors';
+import vislibComponentsSeedColorsProvider from 'ui/vis/components/color/seed_colors';
 import { EventEmitter } from 'events';
 
 

src/ui/public/vislib/__tests__/components/color.js → src/ui/public/vis/__tests__/components/color.js

@@ -3,10 +3,10 @@ import expect from 'expect.js';
 import ngMock from 'ng_mock';
 import _ from 'lodash';
 import d3 from 'd3';
-import VislibComponentsColorSeedColorsProvider from 'ui/vislib/components/color/seed_colors';
-import VislibComponentsColorColorProvider from 'ui/vislib/components/color/color';
-import VislibComponentsColorMappedColorsProvider from 'ui/vislib/components/color/mapped_colors';
-import VislibComponentsColorColorPaletteProvider from 'ui/vislib/components/color/color_palette';
+import VislibComponentsColorSeedColorsProvider from 'ui/vis/components/color/seed_colors';
+import VislibComponentsColorColorProvider from 'ui/vis/components/color/color';
+import VislibComponentsColorMappedColorsProvider from 'ui/vis/components/color/mapped_colors';
+import VislibComponentsColorColorPaletteProvider from 'ui/vis/components/color/color_palette';
 
 describe('Vislib Color Module Test Suite', function () {
   let seedColors;

src/ui/public/vis/components/index.js

@@ -0,0 +1,9 @@
+import TooltipProvider from './tooltip';
+import ColorProvider from './color';
+
+export default function ComponentsProvider(Private) {
+  return {
+    tooltip: Private(TooltipProvider),
+    colors: Private(ColorProvider)
+  };
+}

src/ui/public/vis/vis_type.js

@@ -1,4 +1,4 @@
-import VisSchemasProvider from 'ui/vis/schemas';
+import VisSchemasProvider from './schemas';
 
 export default function VisTypeFactory(Private) {
   const VisTypeSchemas = Private(VisSchemasProvider);

src/ui/public/vislib/__tests__/visualizations/tile_maps/map.js → src/ui/public/vis_maps/__tests__/tile_maps/map.js

@@ -7,7 +7,7 @@ import L from 'leaflet';
 import sinon from 'auto-release-sinon';
 import geoJsonData from 'fixtures/vislib/mock_data/geohash/_geo_json';
 import $ from 'jquery';
-import VislibVisualizationsMapProvider from 'ui/vislib/visualizations/_map';
+import VislibVisualizationsMapProvider from 'ui/vis_maps/visualizations/_map';
 
 // // Data
 // const dataArray = [

src/ui/public/vislib/__tests__/visualizations/tile_maps/markers.js → src/ui/public/vis_maps/__tests__/tile_maps/markers.js

@@ -7,10 +7,10 @@ import L from 'leaflet';
 import sinon from 'auto-release-sinon';
 import geoJsonData from 'fixtures/vislib/mock_data/geohash/_geo_json';
 import $ from 'jquery';
-import VislibVisualizationsMarkerTypesBaseMarkerProvider from 'ui/vislib/visualizations/marker_types/base_marker';
-import VislibVisualizationsMarkerTypesShadedCirclesProvider from 'ui/vislib/visualizations/marker_types/shaded_circles';
-import VislibVisualizationsMarkerTypesScaledCirclesProvider from 'ui/vislib/visualizations/marker_types/scaled_circles';
-import VislibVisualizationsMarkerTypesHeatmapProvider from 'ui/vislib/visualizations/marker_types/heatmap';
+import VislibVisualizationsMarkerTypesBaseMarkerProvider from 'ui/vis_maps/visualizations/marker_types/base_marker';
+import VislibVisualizationsMarkerTypesShadedCirclesProvider from 'ui/vis_maps/visualizations/marker_types/shaded_circles';
+import VislibVisualizationsMarkerTypesScaledCirclesProvider from 'ui/vis_maps/visualizations/marker_types/scaled_circles';
+import VislibVisualizationsMarkerTypesHeatmapProvider from 'ui/vis_maps/visualizations/marker_types/heatmap';
 // defaults to roughly the lower 48 US states
 const defaultSWCoords = [13.496, -143.789];
 const defaultNECoords = [55.526, -57.919];

src/ui/public/vislib/__tests__/visualizations/tile_maps/tile_map.js → src/ui/public/vis_maps/__tests__/tile_maps/tile_map.js

@@ -6,7 +6,7 @@ import sinon from 'auto-release-sinon';
 import geoJsonData from 'fixtures/vislib/mock_data/geohash/_geo_json';
 import MockMap from 'fixtures/tilemap_map';
 import $ from 'jquery';
-import VislibVisualizationsTileMapProvider from 'ui/vislib/visualizations/tile_map';
+import VislibVisualizationsTileMapProvider from 'ui/vis_maps/visualizations/tile_map';
 const mockChartEl = $('<div>');
 
 let TileMap;
@@ -18,6 +18,11 @@ function createTileMap(handler, chartEl, chartData) {
       get: function () {
         return '';
       }
+    },
+    uiState: {
+      get: function () {
+        return '';
+      }
     }
   };
   chartEl = chartEl || mockChartEl;
@@ -32,7 +37,7 @@ describe('TileMap Tests', function () {
 
   beforeEach(ngMock.module('kibana'));
   beforeEach(ngMock.inject(function (Private) {
-    Private.stub(require('ui/vislib/visualizations/_map'), MockMap);
+    Private.stub(require('ui/vis_maps/visualizations/_map'), MockMap);
     TileMap = Private(VislibVisualizationsTileMapProvider);
     extentsStub = sinon.stub(TileMap.prototype, '_appendGeoExtents', _.noop);
   }));
@@ -55,12 +60,6 @@ describe('TileMap Tests', function () {
     it('should return a function', function () {
       expect(tilemap.draw()).to.be.a('function');
     });
-
-    it('should call destroy for clean state', function () {
-      const destroySpy = sinon.spy(tilemap, 'destroy');
-      tilemap.draw();
-      expect(destroySpy.callCount).to.equal(1);
-    });
   });
 
   describe('appendMap', function () {

src/ui/public/vis_maps/lib/data.js

@@ -0,0 +1,200 @@
+import d3 from 'd3';
+import _ from 'lodash';
+export default function DataFactory(Private) {
+  /**
+   * Provides an API for pulling values off the data
+   * and calculating values using the data
+   *
+   * @class Data
+   * @constructor
+   * @param data {Object} Elasticsearch query results
+   * @param attr {Object|*} Visualization options
+   */
+  class Data {
+    constructor(data, uiState) {
+      this.uiState = uiState;
+      this.data = this.copyDataObj(data);
+      this._normalizeOrdered();
+    }
+
+    copyDataObj(data) {
+      const copyChart = data => {
+        const newData = {};
+        Object.keys(data).forEach(key => {
+          if (key !== 'series') {
+            newData[key] = data[key];
+          } else {
+            newData[key] = data[key].map(seri => {
+              return {
+                label: seri.label,
+                values: seri.values.map(val => {
+                  const newVal = _.clone(val);
+                  newVal.aggConfig = val.aggConfig;
+                  newVal.aggConfigResult = val.aggConfigResult;
+                  newVal.extraMetrics = val.extraMetrics;
+                  return newVal;
+                })
+              };
+            });
+          }
+        });
+        return newData;
+      };
+
+      if (!data.series) {
+        const newData = {};
+        Object.keys(data).forEach(key => {
+          if (!['rows', 'columns'].includes(key)) {
+            newData[key] = data[key];
+          }
+          else {
+            newData[key] = data[key].map(chart => {
+              return copyChart(chart);
+            });
+          }
+        });
+        return newData;
+      }
+      return copyChart(data);
+    }
+
+    /**
+     * Returns an array of the actual x and y data value objects
+     * from data with series keys
+     *
+     * @method chartData
+     * @returns {*} Array of data objects
+     */
+    chartData() {
+      if (!this.data.series) {
+        const arr = this.data.rows ? this.data.rows : this.data.columns;
+        return _.toArray(arr);
+      }
+      return [this.data];
+    }
+
+    /**
+     * Returns an array of chart data objects
+     *
+     * @method getVisData
+     * @returns {*} Array of chart data objects
+     */
+    getVisData() {
+      let visData;
+
+      if (this.data.rows) {
+        visData = this.data.rows;
+      } else if (this.data.columns) {
+        visData = this.data.columns;
+      } else {
+        visData = [this.data];
+      }
+
+      return visData;
+    }
+
+    /**
+     * get min and max for all cols, rows of data
+     *
+     * @method getMaxMin
+     * @return {Object}
+     */
+    getGeoExtents() {
+      const visData = this.getVisData();
+
+      return _.reduce(_.pluck(visData, 'geoJson.properties'), function (minMax, props) {
+        return {
+          min: Math.min(props.min, minMax.min),
+          max: Math.max(props.max, minMax.max)
+        };
+      }, { min: Infinity, max: -Infinity });
+    }
+
+    /**
+     * Get attributes off the data, e.g. `tooltipFormatter` or `xAxisFormatter`
+     * pulls the value off the first item in the array
+     * these values are typically the same between data objects of the same chart
+     * TODO: May need to verify this or refactor
+     *
+     * @method get
+     * @param thing {String} Data object key
+     * @returns {*} Data object value
+     */
+    get(thing, def) {
+      const source = (this.data.rows || this.data.columns || [this.data])[0];
+      return _.get(source, thing, def);
+    }
+
+    /**
+     * Return an array of all value objects
+     * Pluck the data.series array from each data object
+     * Create an array of all the value objects from the series array
+     *
+     * @method flatten
+     * @returns {Array} Value objects
+     */
+    flatten() {
+      return _(this.chartData())
+        .pluck('series')
+        .flattenDeep()
+        .pluck('values')
+        .flattenDeep()
+        .value();
+    }
+
+    /**
+     * ensure that the datas ordered property has a min and max
+     * if the data represents an ordered date range.
+     *
+     * @return {undefined}
+     */
+    _normalizeOrdered() {
+      const data = this.getVisData();
+      const self = this;
+
+      data.forEach(function (d) {
+        if (!d.ordered || !d.ordered.date) return;
+
+        const missingMin = d.ordered.min == null;
+        const missingMax = d.ordered.max == null;
+
+        if (missingMax || missingMin) {
+          const extent = d3.extent(self.xValues());
+          if (missingMin) d.ordered.min = extent[0];
+          if (missingMax) d.ordered.max = extent[1];
+        }
+      });
+    }
+
+    /**
+     * Calculates min and max values for all map data
+     * series.rows is an array of arrays
+     * each row is an array of values
+     * last value in row array is bucket count
+     *
+     * @method mapDataExtents
+     * @param series {Array} Array of data objects
+     * @returns {Array} min and max values
+     */
+    mapDataExtents(series) {
+      const values = _.map(series.rows, function (row) {
+        return row[row.length - 1];
+      });
+      return [_.min(values), _.max(values)];
+    }
+
+    /**
+     * Get the maximum number of series, considering each chart
+     * individually.
+     *
+     * @return {number} - the largest number of series from all charts
+     */
+    maxNumberOfSeries() {
+      return this.chartData().reduce(function (max, chart) {
+        return Math.max(max, chart.series.length);
+      }, 0);
+    }
+  }
+
+  return Data;
+}