[backport] PR #7724 to 4.1 - New tile map service

src/kibana/components/vislib/visualizations/tile_map.js

@@ -1,8 +1,14 @@
 define(function (require) {
-  return function TileMapFactory(d3, Private, config) {
+  return function TileMapFactory(d3, Private, configFile, kbnVersion) {
     var _ = require('lodash');
     var $ = require('jquery');
     var L = require('leaflet');
+    var marked = require('marked');
+    var queryString = require('utils/query_string');
+    marked.setOptions({
+      gfm: true,
+      sanitize: true
+    });
     require('leaflet-heat');
     require('leaflet-draw');
     require('css!components/vislib/styles/main');
@@ -17,6 +23,12 @@ define(function (require) {
       return arr.map(function (curr, idx) { return arr[l - (idx + 1)]; });
     }
 
+    function addParamToUrl(url, key, value) {
+      var separator = _.contains(url, '?') ? '&' : '?';
+      var encodedParam = queryString.param(key, value);
+      return url + separator + encodedParam;
+    }
+
     /**
      * Tile Map Visualization: renders maps
      *
@@ -75,11 +87,12 @@ define(function (require) {
           self.addLatLng(self.geoJson);
 
           var div = $(this).addClass('tilemap');
-          var tileLayer = L.tileLayer('https://otile{s}-s.mqcdn.com/tiles/1.0.0/map/{z}/{x}/{y}.jpeg', {
-            attribution: 'Tiles by <a href="http://www.mapquest.com/">MapQuest</a> &mdash; ' +
-              'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
-              '<a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>',
-            subdomains: '1234'
+          var tileUrl = addParamToUrl(configFile.tilemap_url, 'kibana-version', kbnVersion);
+          var tileLayer = L.tileLayer(tileUrl, {
+            attribution: marked(configFile.tilemap_attribution),
+            subdomains: configFile.tilemap_subdomains,
+            minZoom: configFile.tilemap_min_zoom,
+            maxZoom: configFile.tilemap_max_zoom
           });
 
           var drawOptions = {draw: {}};
@@ -97,8 +110,6 @@ define(function (require) {
           });
 
           var mapOptions = {
-            minZoom: 1,
-            maxZoom: 18,
             layers: tileLayer,
             center: self._attr.mapCenter,
             zoom: self._attr.mapZoom,

src/kibana/plugins/visualize/styles/main.less

@@ -54,4 +54,8 @@
 
 }
 
+.leaflet-control-attribution p {
+  display: inline;
+}
+
 @import "../editor/styles/editor.less";

src/server/config/kibana.yml

@@ -66,3 +66,18 @@ verify_ssl: true
 # A value to use as a XSRF token. This token is sent back to the server on each request
 # and required if you want to execute requests from other clients (like curl).
 # xsrf_token: ""
+
+# The url used for loading tilemaps
+tilemap_url: "https://tiles.elastic.co/v1/default/{z}/{x}/{y}.png?elastic_tile_service_tos=agree&my_app_name=kibana"
+
+# Minimum map zoom level
+tilemap_min_zoom: 0
+
+# Maximum map zoom level
+tilemap_max_zoom: 7
+
+# Displays attribution data in the bottom right corner of the map
+tilemap_attribution: "© [Elastic Tile Service](https://www.elastic.co/elastic_tile_service)"
+
+# A list of subdomains, denoted by {s} in tilemap_url
+tilemap_subdomains: []

src/server/routes/index.js

@@ -8,7 +8,12 @@ router.get('/config', function (req, res, next) {
     'kibana_index',
     'default_app_id',
     'shard_timeout',
-    'xsrf_token'
+    'xsrf_token',
+    'tilemap_url',
+    'tilemap_min_zoom',
+    'tilemap_max_zoom',
+    'tilemap_attribution',
+    'tilemap_subdomains'
   ];
   var data = _.pick(config.kibana, keys);
   data.plugins = config.plugins;