diff --git a/src/legacy/core_plugins/tile_map/common/ems_client.js b/src/legacy/core_plugins/tile_map/common/ems_client.js index 23e830860af29..67800d8ef95c8 100644 --- a/src/legacy/core_plugins/tile_map/common/ems_client.js +++ b/src/legacy/core_plugins/tile_map/common/ems_client.js @@ -139,6 +139,7 @@ export class EMSClient { const url = extendUrl(manifestUrl, { query: this._queryParams }); result = await this._fetchWithTimeout(url); } catch (e) { + console.log('e', manifestUrl); if (!e) { e = new Error('Unknown error'); } @@ -147,6 +148,7 @@ export class EMSClient { } throw new Error(`Unable to retrieve manifest from ${manifestUrl}: ${e.message}`); } finally { + console.log('re', result); return result ? await result.json() : null; } } diff --git a/src/legacy/core_plugins/tile_map/common/tms_service.js b/src/legacy/core_plugins/tile_map/common/tms_service.js index 6ad4a467f4a6c..c40dbbee06046 100644 --- a/src/legacy/core_plugins/tile_map/common/tms_service.js +++ b/src/legacy/core_plugins/tile_map/common/tms_service.js @@ -21,24 +21,26 @@ import _ from 'lodash'; import { ORIGIN } from './origin'; export class TMSService { - _getTileJson = _.once( - async url => this._emsClient.getManifest(this._emsClient.extendUrlWithParams(url))); + + _getEmsJson = _.once(async url => { + return this._emsClient.getManifest(this._emsClient.extendUrlWithParams(url)); + }); constructor(config, emsClient) { this._config = config; this._emsClient = emsClient; } - _getRasterFormats(locale) { + _getRasterFormats(locale, formatType) { return this._config.formats.filter(format => { - return format.locale === locale && format.format === 'raster'; + return format.locale === locale && format.format === formatType; }); } _getDefaultStyleUrl() { - let rasterFormats = this._getRasterFormats(this._emsClient.getLocale()); + let rasterFormats = this._getRasterFormats(this._emsClient.getLocale(), 'raster'); if (!rasterFormats.length) {//fallback to default locale - rasterFormats = this._getRasterFormats(this._emsClient.getDefaultLocale()); + rasterFormats = this._getRasterFormats(this._emsClient.getDefaultLocale(), 'raster'); } if (!rasterFormats.length) { throw new Error(`Cannot find raster tile layer for locale ${this._emsClient.getLocale()} or ${this._emsClient.getDefaultLocale()}`); @@ -49,9 +51,41 @@ export class TMSService { } } + async _getVectorStyleFileUrl() { + + let vectorFormats = this._getRasterFormats(this._emsClient.getLocale(), 'vector'); + if (!vectorFormats.length) {//fallback to default locale + vectorFormats = this._getRasterFormats(this._emsClient.getDefaultLocale(), 'vector'); + } + if (!vectorFormats.length) { + throw new Error(`Cannot find raster tile layer for locale ${this._emsClient.getLocale()} or ${this._emsClient.getDefaultLocale()}`); + } + const defaultStyle = vectorFormats[0]; + if (defaultStyle && defaultStyle.hasOwnProperty('url')) { + return defaultStyle.url; + } + + + } + + async getVectorStyle() { + const url = await this._getVectorStyleFileUrl(); + console.log('vsu', url); + + const extendedUrl = this._emsClient.extendUrlWithParams(url); + console.log('eu', extendedUrl); + // const json = await this._emsClient.getManifest(extendedUrl); + const response = await fetch(extendedUrl); + const json = await response.json(); + console.log('ejs', json); + return json; + + } + async getUrlTemplate() { const defaultStyle = this._getDefaultStyleUrl(); - const tileJson = await this._getTileJson(defaultStyle); + //is this buggy (?) + const tileJson = await this._getEmsJson(defaultStyle); return this._emsClient.extendUrlWithParams(tileJson.tiles[0]); } @@ -91,12 +125,12 @@ export class TMSService { } async getMinZoom() { - const tileJson = await this._getTileJson(this._getDefaultStyleUrl()); + const tileJson = await this._getEmsJson(this._getDefaultStyleUrl()); return tileJson.minzoom; } async getMaxZoom() { - const tileJson = await this._getTileJson(this._getDefaultStyleUrl()); + const tileJson = await this._getEmsJson(this._getDefaultStyleUrl()); return tileJson.maxzoom; } diff --git a/x-pack/legacy/plugins/maps/common/ems_util.js b/x-pack/legacy/plugins/maps/common/ems_util.js index 138c82f93a956..b8d01dadc6aa8 100644 --- a/x-pack/legacy/plugins/maps/common/ems_util.js +++ b/x-pack/legacy/plugins/maps/common/ems_util.js @@ -37,11 +37,18 @@ export async function getEMSResources(emsClient, includeElasticMapsService, lic url: useRelativePathToProxy ? `../${GIS_API_PATH}/${EMS_DATA_FILE_PATH}?id=${encodeURIComponent(fileLayer.getId())}` : fileLayer.getDefaultFormatUrl(), format: format, //legacy: format and meta are split up meta: meta, //legacy, format and meta are split up, - emsLink: fileLayer.getEMSHotLink() + emsLink: fileLayer.getEMSHotLink(), + fileLayer: fileLayer }; }); const tmsServices = await Promise.all(tmsServicesObjs.map(async tmsService => { + + // eslint-disable-next-line max-len + const rasterUrl = useRelativePathToProxy ? `../${GIS_API_PATH}/${EMS_DATA_TMS_PATH}?id=${encodeURIComponent(tmsService.getId())}&x={x}&y={y}&z={z}` : await tmsService.getUrlTemplate(); + + // const vectorUrl = useRelativePathToProxy ? + return { name: tmsService.getDisplayName(), origin: tmsService.getOrigin(), @@ -50,8 +57,9 @@ export async function getEMSResources(emsClient, includeElasticMapsService, lic maxZoom: await tmsService.getMaxZoom(), attribution: tmsService.getHTMLAttribution(), attributionMarkdown: tmsService.getMarkdownAttribution(), - // eslint-disable-next-line max-len - url: useRelativePathToProxy ? `../${GIS_API_PATH}/${EMS_DATA_TMS_PATH}?id=${encodeURIComponent(tmsService.getId())}&x={x}&y={y}&z={z}` : await tmsService.getUrlTemplate() + url: rasterUrl, + tmsService: tmsService, + vectorStyle: await tmsService.getVectorStyle() }; })); diff --git a/x-pack/legacy/plugins/maps/public/connected_components/map/mb/utils.js b/x-pack/legacy/plugins/maps/public/connected_components/map/mb/utils.js index 6e0a61ad73bc6..b1e7d00ab7745 100644 --- a/x-pack/legacy/plugins/maps/public/connected_components/map/mb/utils.js +++ b/x-pack/legacy/plugins/maps/public/connected_components/map/mb/utils.js @@ -8,6 +8,7 @@ import _ from 'lodash'; import mapboxgl from 'mapbox-gl'; import chrome from 'ui/chrome'; import { MAKI_SPRITE_PATH, MB_SOURCE_ID_LAYER_ID_PREFIX_DELIMITER } from '../../../../common/constants'; +import React from 'react'; function relativeToAbsolute(url) { const a = document.createElement('a'); @@ -17,6 +18,7 @@ function relativeToAbsolute(url) { export async function createMbMapInstance({ node, initialView, scrollZoom }) { const makiUrl = relativeToAbsolute(chrome.addBasePath(MAKI_SPRITE_PATH)); + return new Promise((resolve) => { const options = { attributionControl: false, @@ -25,7 +27,9 @@ export async function createMbMapInstance({ node, initialView, scrollZoom }) { version: 8, sources: {}, layers: [], - sprite: makiUrl + sprite: makiUrl, + // sprite: 'https://tiles.maps.elastic.co/styles/osm-bright/sprite', + glyphs: 'https://tiles.maps.elastic.co/fonts/{fontstack}/{range}.pbf' }, scrollZoom, preserveDrawingBuffer: chrome.getInjected('preserveDrawingBuffer', false) @@ -34,7 +38,7 @@ export async function createMbMapInstance({ node, initialView, scrollZoom }) { options.zoom = initialView.zoom; options.center = { lng: initialView.lon, - lat: initialView.lat + lat: }; } const mbMap = new mapboxgl.Map(options); @@ -46,6 +50,7 @@ export async function createMbMapInstance({ node, initialView, scrollZoom }) { mbMap.on('load', () => { resolve(mbMap); }); + window._mbMap = mbMap; }); } @@ -74,7 +79,9 @@ export function removeOrphanedSourcesAndLayers(mbMap, layerList) { } export function syncLayerOrder(mbMap, layerList) { + if (layerList && layerList.length) { + const mbLayers = mbMap.getStyle().layers.slice(); //This assumes that: @@ -85,6 +92,7 @@ export function syncLayerOrder(mbMap, layerList) { const newLayerOrder = layerList.map(l => l.getId()) .filter(layerId => currentLayerOrder.includes(layerId)); + let netPos = 0; let netNeg = 0; const movementArr = currentLayerOrder.reduce((accu, id, idx) => { diff --git a/x-pack/legacy/plugins/maps/public/connected_components/map/mb/view.js b/x-pack/legacy/plugins/maps/public/connected_components/map/mb/view.js index befc0d82c26b3..32a6e8f40a68a 100644 --- a/x-pack/legacy/plugins/maps/public/connected_components/map/mb/view.js +++ b/x-pack/legacy/plugins/maps/public/connected_components/map/mb/view.js @@ -494,12 +494,6 @@ export class MBMapContainer extends React.Component { }; - _getLayerById(layerId) { - return this.props.layerList.find((layer) => { - return layer.getId() === layerId; - }); - } - _getLayerByMbLayerId(mbLayerId) { return this.props.layerList.find((layer) => { const mbLayerIds = layer.getMbLayerIds(); diff --git a/x-pack/legacy/plugins/maps/public/layers/sources/ems_tms_source/ems_tms_source.js b/x-pack/legacy/plugins/maps/public/layers/sources/ems_tms_source/ems_tms_source.js index 57f0c2f29708f..cb1a48040eb82 100644 --- a/x-pack/legacy/plugins/maps/public/layers/sources/ems_tms_source/ems_tms_source.js +++ b/x-pack/legacy/plugins/maps/public/layers/sources/ems_tms_source/ems_tms_source.js @@ -9,6 +9,7 @@ import chrome from 'ui/chrome'; import React from 'react'; import { AbstractTMSSource } from '../tms_source'; import { TileLayer } from '../../tile_layer'; +import { VectorTileLayer } from '../../vector_tile_layer'; import { getEmsTMSServices } from '../../../meta'; import { EMSTMSCreateSourceEditor } from './create_source_editor'; @@ -90,14 +91,14 @@ export class EMSTMSSource extends AbstractTMSSource { } _createDefaultLayerDescriptor(options) { - return TileLayer.createDescriptor({ + return VectorTileLayer.createDescriptor({ sourceDescriptor: this._descriptor, ...options }); } createDefaultLayer(options) { - return new TileLayer({ + return new VectorTileLayer({ layerDescriptor: this._createDefaultLayerDescriptor(options), source: this }); @@ -130,6 +131,12 @@ export class EMSTMSSource extends AbstractTMSSource { }); } + + async getVectorStyle() { + const emsTmsMeta = await this._getEmsTmsMeta(); + return emsTmsMeta.vectorStyle; + } + async getUrlTemplate() { const emsTmsMeta = await this._getEmsTmsMeta(); return emsTmsMeta.url; diff --git a/x-pack/legacy/plugins/maps/public/layers/style_test.js b/x-pack/legacy/plugins/maps/public/layers/style_test.js new file mode 100644 index 0000000000000..b79a3fce4df20 --- /dev/null +++ b/x-pack/legacy/plugins/maps/public/layers/style_test.js @@ -0,0 +1,4961 @@ +/* eslint-disable @kbn/eslint/require-license-header */ +export const styleTest = { + "version": 8, + "name": "OSM Bright", + "metadata": { + "mapbox:type": "template", + "mapbox:groups": { + "1444849364238.8171": { + "collapsed": false, + "name": "Buildings" + }, + "1444849354174.1904": { + "collapsed": true, + "name": "Tunnels" + }, + "1444849388993.3071": { + "collapsed": false, + "name": "Land" + }, + "1444849242106.713": { + "collapsed": false, + "name": "Places" + }, + "1444849382550.77": { + "collapsed": false, + "name": "Water" + }, + "1444849345966.4436": { + "collapsed": false, + "name": "Roads" + }, + "1444849334699.1902": { + "collapsed": true, + "name": "Bridges" + } + }, + "mapbox:autocomposite": false, + "openmaptiles:version": "3.x", + "openmaptiles:mapbox:owner": "openmaptiles", + "openmaptiles:mapbox:source:url": "mapbox://openmaptiles.4qljc88t" + }, + "sources": { + "openmaptiles": { + "type": "vector", + "url": "https://tiles.maps.elastic.co/data/v3.json" + } + }, + "sprite": "https://tiles.maps.elastic.co/styles/osm-bright/sprite", + "glyphs": "https://tiles.maps.elastic.co/fonts/{fontstack}/{range}.pbf", + "layers": [ + { + "id": "background", + "type": "background", + "paint": { + "background-color": "#f8f4f0" + } + }, + { + "id": "landcover-glacier", + "type": "fill", + "metadata": { + "mapbox:group": "1444849388993.3071" + }, + "source": "openmaptiles", + "source-layer": "landcover", + "filter": [ + "==", + "subclass", + "glacier" + ], + "layout": { + "visibility": "visible" + }, + "paint": { + "fill-color": "#fff", + "fill-opacity": { + "base": 1, + "stops": [ + [ + 0, + 0.9 + ], + [ + 10, + 0.3 + ] + ] + } + } + }, + { + "id": "landuse-residential", + "type": "fill", + "metadata": { + "mapbox:group": "1444849388993.3071" + }, + "source": "openmaptiles", + "source-layer": "landuse", + "filter": [ + "==", + "class", + "residential" + ], + "paint": { + "fill-color": { + "base": 1, + "stops": [ + [ + 12, + "hsla(30, 19%, 90%, 0.4)" + ], + [ + 16, + "hsla(30, 19%, 90%, 0.2)" + ] + ] + } + } + }, + { + "id": "landuse-commercial", + "type": "fill", + "metadata": { + "mapbox:group": "1444849388993.3071" + }, + "source": "openmaptiles", + "source-layer": "landuse", + "filter": [ + "all", + [ + "==", + "$type", + "Polygon" + ], + [ + "==", + "class", + "commercial" + ] + ], + "paint": { + "fill-color": "hsla(0, 60%, 87%, 0.23)" + } + }, + { + "id": "landuse-industrial", + "type": "fill", + "metadata": { + "mapbox:group": "1444849388993.3071" + }, + "source": "openmaptiles", + "source-layer": "landuse", + "filter": [ + "all", + [ + "==", + "$type", + "Polygon" + ], + [ + "==", + "class", + "industrial" + ] + ], + "paint": { + "fill-color": "hsla(49, 100%, 88%, 0.34)" + } + }, + { + "id": "park", + "type": "fill", + "metadata": { + "mapbox:group": "1444849388993.3071" + }, + "source": "openmaptiles", + "source-layer": "park", + "filter": [ + "==", + "$type", + "Polygon" + ], + "paint": { + "fill-color": "#d8e8c8", + "fill-opacity": { + "base": 1.8, + "stops": [ + [ + 9, + 0.5 + ], + [ + 12, + 0.2 + ] + ] + } + } + }, + { + "id": "park-outline", + "type": "line", + "metadata": { + "mapbox:group": "1444849388993.3071" + }, + "source": "openmaptiles", + "source-layer": "park", + "filter": [ + "==", + "$type", + "Polygon" + ], + "layout": {}, + "paint": { + "line-color": { + "base": 1, + "stops": [ + [ + 6, + "hsla(96, 40%, 49%, 0.36)" + ], + [ + 8, + "hsla(96, 40%, 49%, 0.66)" + ] + ] + }, + "line-dasharray": [ + 3, + 3 + ] + } + }, + { + "id": "landuse-cemetery", + "type": "fill", + "metadata": { + "mapbox:group": "1444849388993.3071" + }, + "source": "openmaptiles", + "source-layer": "landuse", + "filter": [ + "==", + "class", + "cemetery" + ], + "paint": { + "fill-color": "#e0e4dd" + } + }, + { + "id": "landuse-hospital", + "type": "fill", + "metadata": { + "mapbox:group": "1444849388993.3071" + }, + "source": "openmaptiles", + "source-layer": "landuse", + "filter": [ + "==", + "class", + "hospital" + ], + "paint": { + "fill-color": "#fde" + } + }, + { + "id": "landuse-school", + "type": "fill", + "metadata": { + "mapbox:group": "1444849388993.3071" + }, + "source": "openmaptiles", + "source-layer": "landuse", + "filter": [ + "==", + "class", + "school" + ], + "paint": { + "fill-color": "#f0e8f8" + } + }, + { + "id": "landuse-railway", + "type": "fill", + "metadata": { + "mapbox:group": "1444849388993.3071" + }, + "source": "openmaptiles", + "source-layer": "landuse", + "filter": [ + "==", + "class", + "railway" + ], + "paint": { + "fill-color": "hsla(30, 19%, 90%, 0.4)" + } + }, + { + "id": "landcover-wood", + "type": "fill", + "metadata": { + "mapbox:group": "1444849388993.3071" + }, + "source": "openmaptiles", + "source-layer": "landcover", + "filter": [ + "==", + "class", + "wood" + ], + "paint": { + "fill-color": "#6a4", + "fill-opacity": 0.1, + "fill-outline-color": "hsla(0, 0%, 0%, 0.03)", + "fill-antialias": { + "base": 1, + "stops": [ + [ + 0, + false + ], + [ + 9, + true + ] + ] + } + } + }, + { + "id": "landcover-grass", + "type": "fill", + "metadata": { + "mapbox:group": "1444849388993.3071" + }, + "source": "openmaptiles", + "source-layer": "landcover", + "filter": [ + "==", + "class", + "grass" + ], + "paint": { + "fill-color": "#d8e8c8", + "fill-opacity": 1 + } + }, + { + "id": "landcover-grass-park", + "type": "fill", + "metadata": { + "mapbox:group": "1444849388993.3071" + }, + "source": "openmaptiles", + "source-layer": "park", + "filter": [ + "==", + "class", + "public_park" + ], + "paint": { + "fill-color": "#d8e8c8", + "fill-opacity": 0.8 + } + }, + { + "id": "waterway_tunnel", + "filter": [ + "all", + [ + "in", + "class", + "river", + "stream", + "canal" + ], + [ + "==", + "brunnel", + "tunnel" + ] + ], + "type": "line", + "source": "openmaptiles", + "source-layer": "waterway", + "layout": { + "line-cap": "round" + }, + "paint": { + "line-color": "#a0c8f0", + "line-width": { + "base": 1.3, + "stops": [ + [ + 13, + 0.5 + ], + [ + 20, + 6 + ] + ] + }, + "line-dasharray": [ + 2, + 4 + ] + }, + "minzoom": 14 + }, + { + "id": "waterway-other", + "type": "line", + "metadata": { + "mapbox:group": "1444849382550.77" + }, + "source": "openmaptiles", + "source-layer": "waterway", + "filter": [ + "!in", + "class", + "canal", + "river", + "stream" + ], + "layout": { + "line-cap": "round" + }, + "paint": { + "line-color": "#a0c8f0", + "line-width": { + "base": 1.3, + "stops": [ + [ + 13, + 0.5 + ], + [ + 20, + 2 + ] + ] + } + } + }, + { + "id": "waterway-stream-canal", + "type": "line", + "metadata": { + "mapbox:group": "1444849382550.77" + }, + "source": "openmaptiles", + "source-layer": "waterway", + "filter": [ + "all", + [ + "in", + "class", + "canal", + "stream" + ], + [ + "!=", + "brunnel", + "tunnel" + ] + ], + "layout": { + "line-cap": "round" + }, + "paint": { + "line-color": "#a0c8f0", + "line-width": { + "base": 1.3, + "stops": [ + [ + 13, + 0.5 + ], + [ + 20, + 6 + ] + ] + } + } + }, + { + "id": "waterway-river", + "type": "line", + "metadata": { + "mapbox:group": "1444849382550.77" + }, + "source": "openmaptiles", + "source-layer": "waterway", + "filter": [ + "all", + [ + "==", + "class", + "river" + ], + [ + "!=", + "brunnel", + "tunnel" + ] + ], + "layout": { + "line-cap": "round" + }, + "paint": { + "line-color": "#a0c8f0", + "line-width": { + "base": 1.2, + "stops": [ + [ + 10, + 0.8 + ], + [ + 20, + 6 + ] + ] + } + } + }, + { + "id": "water-offset", + "type": "fill", + "metadata": { + "mapbox:group": "1444849382550.77" + }, + "source": "openmaptiles", + "source-layer": "water", + "maxzoom": 8, + "filter": [ + "==", + "$type", + "Polygon" + ], + "layout": { + "visibility": "visible" + }, + "paint": { + "fill-opacity": 1, + "fill-color": "#a0c8f0", + "fill-translate": { + "base": 1, + "stops": [ + [ + 6, + [ + 2, + 0 + ] + ], + [ + 8, + [ + 0, + 0 + ] + ] + ] + } + } + }, + { + "id": "water", + "type": "fill", + "metadata": { + "mapbox:group": "1444849382550.77" + }, + "source": "openmaptiles", + "source-layer": "water", + "layout": { + "visibility": "visible" + }, + "paint": { + "fill-color": "hsl(210, 67%, 85%)" + } + }, + { + "id": "water-pattern", + "type": "fill", + "metadata": { + "mapbox:group": "1444849382550.77" + }, + "source": "openmaptiles", + "source-layer": "water", + "layout": { + "visibility": "visible" + }, + "paint": { + "fill-translate": [ + 0, + 2.5 + ], + "fill-pattern": "wave" + } + }, + { + "id": "landcover-ice-shelf", + "type": "fill", + "metadata": { + "mapbox:group": "1444849382550.77" + }, + "source": "openmaptiles", + "source-layer": "landcover", + "filter": [ + "==", + "subclass", + "ice_shelf" + ], + "layout": { + "visibility": "visible" + }, + "paint": { + "fill-color": "#fff", + "fill-opacity": { + "base": 1, + "stops": [ + [ + 0, + 0.9 + ], + [ + 10, + 0.3 + ] + ] + } + } + }, + { + "id": "building", + "type": "fill", + "metadata": { + "mapbox:group": "1444849364238.8171" + }, + "source": "openmaptiles", + "source-layer": "building", + "paint": { + "fill-color": { + "base": 1, + "stops": [ + [ + 15.5, + "#f2eae2" + ], + [ + 16, + "#dfdbd7" + ] + ] + }, + "fill-antialias": true + } + }, + { + "id": "building-top", + "type": "fill", + "metadata": { + "mapbox:group": "1444849364238.8171" + }, + "source": "openmaptiles", + "source-layer": "building", + "layout": { + "visibility": "visible" + }, + "paint": { + "fill-translate": { + "base": 1, + "stops": [ + [ + 14, + [ + 0, + 0 + ] + ], + [ + 16, + [ + -2, + -2 + ] + ] + ] + }, + "fill-outline-color": "#dfdbd7", + "fill-color": "#f2eae2", + "fill-opacity": { + "base": 1, + "stops": [ + [ + 13, + 0 + ], + [ + 16, + 1 + ] + ] + } + } + }, + { + "id": "tunnel-service-track-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849354174.1904" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "tunnel" + ], + [ + "in", + "class", + "service", + "track" + ] + ], + "layout": { + "line-join": "round" + }, + "paint": { + "line-color": "#cfcdca", + "line-dasharray": [ + 0.5, + 0.25 + ], + "line-width": { + "base": 1.2, + "stops": [ + [ + 15, + 1 + ], + [ + 16, + 4 + ], + [ + 20, + 11 + ] + ] + } + } + }, + { + "id": "tunnel-minor-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849354174.1904" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "tunnel" + ], + [ + "==", + "class", + "minor" + ] + ], + "layout": { + "line-join": "round" + }, + "paint": { + "line-color": "#cfcdca", + "line-opacity": { + "stops": [ + [ + 12, + 0 + ], + [ + 12.5, + 1 + ] + ] + }, + "line-width": { + "base": 1.2, + "stops": [ + [ + 12, + 0.5 + ], + [ + 13, + 1 + ], + [ + 14, + 4 + ], + [ + 20, + 15 + ] + ] + } + } + }, + { + "id": "tunnel-secondary-tertiary-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849354174.1904" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "tunnel" + ], + [ + "in", + "class", + "secondary", + "tertiary" + ] + ], + "layout": { + "line-join": "round" + }, + "paint": { + "line-color": "#e9ac77", + "line-opacity": 1, + "line-width": { + "base": 1.2, + "stops": [ + [ + 8, + 1.5 + ], + [ + 20, + 17 + ] + ] + } + } + }, + { + "id": "tunnel-trunk-primary-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849354174.1904" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "tunnel" + ], + [ + "in", + "class", + "primary", + "trunk" + ] + ], + "layout": { + "line-join": "round" + }, + "paint": { + "line-color": "#e9ac77", + "line-width": { + "base": 1.2, + "stops": [ + [ + 5, + 0.4 + ], + [ + 6, + 0.6 + ], + [ + 7, + 1.5 + ], + [ + 20, + 22 + ] + ] + } + } + }, + { + "id": "tunnel-motorway-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849354174.1904" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "tunnel" + ], + [ + "==", + "class", + "motorway" + ] + ], + "layout": { + "line-join": "round", + "visibility": "visible" + }, + "paint": { + "line-color": "#e9ac77", + "line-dasharray": [ + 0.5, + 0.25 + ], + "line-width": { + "base": 1.2, + "stops": [ + [ + 5, + 0.4 + ], + [ + 6, + 0.6 + ], + [ + 7, + 1.5 + ], + [ + 20, + 22 + ] + ] + } + } + }, + { + "id": "tunnel-path", + "type": "line", + "metadata": { + "mapbox:group": "1444849354174.1904" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "$type", + "LineString" + ], + [ + "all", + [ + "==", + "brunnel", + "tunnel" + ], + [ + "==", + "class", + "path" + ] + ] + ], + "paint": { + "line-color": "#cba", + "line-dasharray": [ + 1.5, + 0.75 + ], + "line-width": { + "base": 1.2, + "stops": [ + [ + 15, + 1.2 + ], + [ + 20, + 4 + ] + ] + } + } + }, + { + "id": "tunnel-service-track", + "type": "line", + "metadata": { + "mapbox:group": "1444849354174.1904" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "tunnel" + ], + [ + "in", + "class", + "service", + "track" + ] + ], + "layout": { + "line-join": "round" + }, + "paint": { + "line-color": "#fff", + "line-width": { + "base": 1.2, + "stops": [ + [ + 15.5, + 0 + ], + [ + 16, + 2 + ], + [ + 20, + 7.5 + ] + ] + } + } + }, + { + "id": "tunnel-minor", + "type": "line", + "metadata": { + "mapbox:group": "1444849354174.1904" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "tunnel" + ], + [ + "==", + "class", + "minor_road" + ] + ], + "layout": { + "line-join": "round" + }, + "paint": { + "line-color": "#fff", + "line-opacity": 1, + "line-width": { + "base": 1.2, + "stops": [ + [ + 13.5, + 0 + ], + [ + 14, + 2.5 + ], + [ + 20, + 11.5 + ] + ] + } + } + }, + { + "id": "tunnel-secondary-tertiary", + "type": "line", + "metadata": { + "mapbox:group": "1444849354174.1904" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "tunnel" + ], + [ + "in", + "class", + "secondary", + "tertiary" + ] + ], + "layout": { + "line-join": "round" + }, + "paint": { + "line-color": "#fff4c6", + "line-width": { + "base": 1.2, + "stops": [ + [ + 6.5, + 0 + ], + [ + 7, + 0.5 + ], + [ + 20, + 10 + ] + ] + } + } + }, + { + "id": "tunnel-trunk-primary", + "type": "line", + "metadata": { + "mapbox:group": "1444849354174.1904" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "tunnel" + ], + [ + "in", + "class", + "primary", + "trunk" + ] + ], + "layout": { + "line-join": "round" + }, + "paint": { + "line-color": "#fff4c6", + "line-width": { + "base": 1.2, + "stops": [ + [ + 6.5, + 0 + ], + [ + 7, + 0.5 + ], + [ + 20, + 18 + ] + ] + } + } + }, + { + "id": "tunnel-motorway", + "type": "line", + "metadata": { + "mapbox:group": "1444849354174.1904" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "tunnel" + ], + [ + "==", + "class", + "motorway" + ] + ], + "layout": { + "line-join": "round", + "visibility": "visible" + }, + "paint": { + "line-color": "#ffdaa6", + "line-width": { + "base": 1.2, + "stops": [ + [ + 6.5, + 0 + ], + [ + 7, + 0.5 + ], + [ + 20, + 18 + ] + ] + } + } + }, + { + "id": "tunnel-railway", + "type": "line", + "metadata": { + "mapbox:group": "1444849354174.1904" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "tunnel" + ], + [ + "==", + "class", + "rail" + ] + ], + "paint": { + "line-color": "#bbb", + "line-width": { + "base": 1.4, + "stops": [ + [ + 14, + 0.4 + ], + [ + 15, + 0.75 + ], + [ + 20, + 2 + ] + ] + }, + "line-dasharray": [ + 2, + 2 + ] + } + }, + { + "id": "ferry", + "type": "line", + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "in", + "class", + "ferry" + ] + ], + "layout": { + "line-join": "round", + "visibility": "visible" + }, + "paint": { + "line-color": "rgba(108, 159, 182, 1)", + "line-width": 1.1, + "line-dasharray": [ + 2, + 2 + ] + } + }, + { + "id": "aeroway-taxiway-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "aeroway", + "minzoom": 12, + "filter": [ + "all", + [ + "in", + "class", + "taxiway" + ] + ], + "layout": { + "line-cap": "round", + "line-join": "round", + "visibility": "visible" + }, + "paint": { + "line-color": "rgba(153, 153, 153, 1)", + "line-width": { + "base": 1.5, + "stops": [ + [ + 11, + 2 + ], + [ + 17, + 12 + ] + ] + }, + "line-opacity": 1 + } + }, + { + "id": "aeroway-runway-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "aeroway", + "minzoom": 12, + "filter": [ + "all", + [ + "in", + "class", + "runway" + ] + ], + "layout": { + "line-cap": "round", + "line-join": "round", + "visibility": "visible" + }, + "paint": { + "line-color": "rgba(153, 153, 153, 1)", + "line-width": { + "base": 1.5, + "stops": [ + [ + 11, + 5 + ], + [ + 17, + 55 + ] + ] + }, + "line-opacity": 1 + } + }, + { + "id": "aeroway-area", + "type": "fill", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "aeroway", + "minzoom": 4, + "filter": [ + "all", + [ + "==", + "$type", + "Polygon" + ], + [ + "in", + "class", + "runway", + "taxiway" + ] + ], + "layout": { + "visibility": "visible" + }, + "paint": { + "fill-opacity": { + "base": 1, + "stops": [ + [ + 13, + 0 + ], + [ + 14, + 1 + ] + ] + }, + "fill-color": "rgba(255, 255, 255, 1)" + } + }, + { + "id": "aeroway-taxiway", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "aeroway", + "minzoom": 4, + "filter": [ + "all", + [ + "in", + "class", + "taxiway" + ], + [ + "==", + "$type", + "LineString" + ] + ], + "layout": { + "line-cap": "round", + "line-join": "round", + "visibility": "visible" + }, + "paint": { + "line-color": "rgba(255, 255, 255, 1)", + "line-width": { + "base": 1.5, + "stops": [ + [ + 11, + 1 + ], + [ + 17, + 10 + ] + ] + }, + "line-opacity": { + "base": 1, + "stops": [ + [ + 11, + 0 + ], + [ + 12, + 1 + ] + ] + } + } + }, + { + "id": "aeroway-runway", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "aeroway", + "minzoom": 4, + "filter": [ + "all", + [ + "in", + "class", + "runway" + ], + [ + "==", + "$type", + "LineString" + ] + ], + "layout": { + "line-cap": "round", + "line-join": "round", + "visibility": "visible" + }, + "paint": { + "line-color": "rgba(255, 255, 255, 1)", + "line-width": { + "base": 1.5, + "stops": [ + [ + 11, + 4 + ], + [ + 17, + 50 + ] + ] + }, + "line-opacity": { + "base": 1, + "stops": [ + [ + 11, + 0 + ], + [ + 12, + 1 + ] + ] + } + } + }, + { + "id": "highway-area", + "type": "fill", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "==", + "$type", + "Polygon" + ], + "layout": { + "visibility": "visible" + }, + "paint": { + "fill-color": "hsla(0, 0%, 89%, 0.56)", + "fill-outline-color": "#cfcdca", + "fill-opacity": 0.9, + "fill-antialias": false + } + }, + { + "id": "highway-motorway-link-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "minzoom": 12, + "filter": [ + "all", + [ + "!in", + "brunnel", + "bridge", + "tunnel" + ], + [ + "==", + "class", + "motorway_link" + ] + ], + "layout": { + "line-cap": "round", + "line-join": "round" + }, + "paint": { + "line-color": "#e9ac77", + "line-opacity": 1, + "line-width": { + "base": 1.2, + "stops": [ + [ + 12, + 1 + ], + [ + 13, + 3 + ], + [ + 14, + 4 + ], + [ + 20, + 15 + ] + ] + } + } + }, + { + "id": "highway-link-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "minzoom": 13, + "filter": [ + "all", + [ + "!in", + "brunnel", + "bridge", + "tunnel" + ], + [ + "in", + "class", + "primary_link", + "secondary_link", + "tertiary_link", + "trunk_link" + ] + ], + "layout": { + "line-cap": "round", + "line-join": "round", + "visibility": "visible" + }, + "paint": { + "line-color": "#e9ac77", + "line-opacity": 1, + "line-width": { + "base": 1.2, + "stops": [ + [ + 12, + 1 + ], + [ + 13, + 3 + ], + [ + 14, + 4 + ], + [ + 20, + 15 + ] + ] + } + } + }, + { + "id": "highway-minor-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "$type", + "LineString" + ], + [ + "all", + [ + "!=", + "brunnel", + "tunnel" + ], + [ + "in", + "class", + "minor", + "service", + "track" + ] + ] + ], + "layout": { + "line-cap": "round", + "line-join": "round" + }, + "paint": { + "line-color": "#cfcdca", + "line-opacity": { + "stops": [ + [ + 12, + 0 + ], + [ + 12.5, + 1 + ] + ] + }, + "line-width": { + "base": 1.2, + "stops": [ + [ + 12, + 0.5 + ], + [ + 13, + 1 + ], + [ + 14, + 4 + ], + [ + 20, + 15 + ] + ] + } + } + }, + { + "id": "highway-secondary-tertiary-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "!in", + "brunnel", + "bridge", + "tunnel" + ], + [ + "in", + "class", + "secondary", + "tertiary" + ] + ], + "layout": { + "line-cap": "butt", + "line-join": "round", + "visibility": "visible" + }, + "paint": { + "line-color": "#e9ac77", + "line-opacity": 1, + "line-width": { + "base": 1.2, + "stops": [ + [ + 8, + 1.5 + ], + [ + 20, + 17 + ] + ] + } + } + }, + { + "id": "highway-primary-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "minzoom": 5, + "filter": [ + "all", + [ + "!in", + "brunnel", + "bridge", + "tunnel" + ], + [ + "in", + "class", + "primary" + ] + ], + "layout": { + "line-cap": "butt", + "line-join": "round", + "visibility": "visible" + }, + "paint": { + "line-color": "#e9ac77", + "line-opacity": { + "stops": [ + [ + 7, + 0 + ], + [ + 8, + 1 + ] + ] + }, + "line-width": { + "base": 1.2, + "stops": [ + [ + 7, + 0 + ], + [ + 8, + 0.6 + ], + [ + 9, + 1.5 + ], + [ + 20, + 22 + ] + ] + } + } + }, + { + "id": "highway-trunk-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "minzoom": 5, + "filter": [ + "all", + [ + "!in", + "brunnel", + "bridge", + "tunnel" + ], + [ + "in", + "class", + "trunk" + ] + ], + "layout": { + "line-cap": "butt", + "line-join": "round", + "visibility": "visible" + }, + "paint": { + "line-color": "#e9ac77", + "line-opacity": { + "stops": [ + [ + 5, + 0 + ], + [ + 6, + 1 + ] + ] + }, + "line-width": { + "base": 1.2, + "stops": [ + [ + 5, + 0 + ], + [ + 6, + 0.6 + ], + [ + 7, + 1.5 + ], + [ + 20, + 22 + ] + ] + } + } + }, + { + "id": "highway-motorway-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "minzoom": 4, + "filter": [ + "all", + [ + "!in", + "brunnel", + "bridge", + "tunnel" + ], + [ + "==", + "class", + "motorway" + ] + ], + "layout": { + "line-cap": "butt", + "line-join": "round", + "visibility": "visible" + }, + "paint": { + "line-color": "#e9ac77", + "line-width": { + "base": 1.2, + "stops": [ + [ + 4, + 0 + ], + [ + 5, + 0.4 + ], + [ + 6, + 0.6 + ], + [ + 7, + 1.5 + ], + [ + 20, + 22 + ] + ] + }, + "line-opacity": { + "stops": [ + [ + 4, + 0 + ], + [ + 5, + 1 + ] + ] + } + } + }, + { + "id": "highway-path", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "$type", + "LineString" + ], + [ + "all", + [ + "!in", + "brunnel", + "bridge", + "tunnel" + ], + [ + "==", + "class", + "path" + ] + ] + ], + "paint": { + "line-color": "#cba", + "line-dasharray": [ + 1.5, + 0.75 + ], + "line-width": { + "base": 1.2, + "stops": [ + [ + 15, + 1.2 + ], + [ + 20, + 4 + ] + ] + } + } + }, + { + "id": "highway-motorway-link", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "minzoom": 12, + "filter": [ + "all", + [ + "!in", + "brunnel", + "bridge", + "tunnel" + ], + [ + "==", + "class", + "motorway_link" + ] + ], + "layout": { + "line-cap": "round", + "line-join": "round" + }, + "paint": { + "line-color": "#fc8", + "line-width": { + "base": 1.2, + "stops": [ + [ + 12.5, + 0 + ], + [ + 13, + 1.5 + ], + [ + 14, + 2.5 + ], + [ + 20, + 11.5 + ] + ] + } + } + }, + { + "id": "highway-link", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "minzoom": 13, + "filter": [ + "all", + [ + "!in", + "brunnel", + "bridge", + "tunnel" + ], + [ + "in", + "class", + "primary_link", + "secondary_link", + "tertiary_link", + "trunk_link" + ] + ], + "layout": { + "line-cap": "round", + "line-join": "round", + "visibility": "visible" + }, + "paint": { + "line-color": "#fea", + "line-width": { + "base": 1.2, + "stops": [ + [ + 12.5, + 0 + ], + [ + 13, + 1.5 + ], + [ + 14, + 2.5 + ], + [ + 20, + 11.5 + ] + ] + } + } + }, + { + "id": "highway-minor", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "$type", + "LineString" + ], + [ + "all", + [ + "!=", + "brunnel", + "tunnel" + ], + [ + "in", + "class", + "minor", + "service", + "track" + ] + ] + ], + "layout": { + "line-cap": "round", + "line-join": "round" + }, + "paint": { + "line-color": "#fff", + "line-opacity": 1, + "line-width": { + "base": 1.2, + "stops": [ + [ + 13.5, + 0 + ], + [ + 14, + 2.5 + ], + [ + 20, + 11.5 + ] + ] + } + } + }, + { + "id": "highway-secondary-tertiary", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "!in", + "brunnel", + "bridge", + "tunnel" + ], + [ + "in", + "class", + "secondary", + "tertiary" + ] + ], + "layout": { + "line-cap": "round", + "line-join": "round", + "visibility": "visible" + }, + "paint": { + "line-color": "#fea", + "line-width": { + "base": 1.2, + "stops": [ + [ + 6.5, + 0 + ], + [ + 8, + 0.5 + ], + [ + 20, + 13 + ] + ] + } + } + }, + { + "id": "highway-primary", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "$type", + "LineString" + ], + [ + "all", + [ + "!in", + "brunnel", + "bridge", + "tunnel" + ], + [ + "in", + "class", + "primary" + ] + ] + ], + "layout": { + "line-cap": "round", + "line-join": "round", + "visibility": "visible" + }, + "paint": { + "line-color": "#fea", + "line-width": { + "base": 1.2, + "stops": [ + [ + 8.5, + 0 + ], + [ + 9, + 0.5 + ], + [ + 20, + 18 + ] + ] + } + } + }, + { + "id": "highway-trunk", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "$type", + "LineString" + ], + [ + "all", + [ + "!in", + "brunnel", + "bridge", + "tunnel" + ], + [ + "in", + "class", + "trunk" + ] + ] + ], + "layout": { + "line-cap": "round", + "line-join": "round", + "visibility": "visible" + }, + "paint": { + "line-color": "#fea", + "line-width": { + "base": 1.2, + "stops": [ + [ + 6.5, + 0 + ], + [ + 7, + 0.5 + ], + [ + 20, + 18 + ] + ] + } + } + }, + { + "id": "highway-motorway", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "minzoom": 5, + "filter": [ + "all", + [ + "==", + "$type", + "LineString" + ], + [ + "all", + [ + "!in", + "brunnel", + "bridge", + "tunnel" + ], + [ + "==", + "class", + "motorway" + ] + ] + ], + "layout": { + "line-cap": "round", + "line-join": "round", + "visibility": "visible" + }, + "paint": { + "line-color": "#fc8", + "line-width": { + "base": 1.2, + "stops": [ + [ + 6.5, + 0 + ], + [ + 7, + 0.5 + ], + [ + 20, + 18 + ] + ] + } + } + }, + { + "id": "railway-transit", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "$type", + "LineString" + ], + [ + "all", + [ + "==", + "class", + "transit" + ], + [ + "!in", + "brunnel", + "tunnel" + ] + ] + ], + "layout": { + "visibility": "visible" + }, + "paint": { + "line-color": "hsla(0, 0%, 73%, 0.77)", + "line-width": { + "base": 1.4, + "stops": [ + [ + 14, + 0.4 + ], + [ + 20, + 1 + ] + ] + } + } + }, + { + "id": "railway-transit-hatching", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "$type", + "LineString" + ], + [ + "all", + [ + "==", + "class", + "transit" + ], + [ + "!in", + "brunnel", + "tunnel" + ] + ] + ], + "layout": { + "visibility": "visible" + }, + "paint": { + "line-color": "hsla(0, 0%, 73%, 0.68)", + "line-dasharray": [ + 0.2, + 8 + ], + "line-width": { + "base": 1.4, + "stops": [ + [ + 14.5, + 0 + ], + [ + 15, + 2 + ], + [ + 20, + 6 + ] + ] + } + } + }, + { + "id": "railway-service", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "$type", + "LineString" + ], + [ + "all", + [ + "==", + "class", + "rail" + ], + [ + "has", + "service" + ] + ] + ], + "paint": { + "line-color": "hsla(0, 0%, 73%, 0.77)", + "line-width": { + "base": 1.4, + "stops": [ + [ + 14, + 0.4 + ], + [ + 20, + 1 + ] + ] + } + } + }, + { + "id": "railway-service-hatching", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "$type", + "LineString" + ], + [ + "all", + [ + "==", + "class", + "rail" + ], + [ + "has", + "service" + ] + ] + ], + "layout": { + "visibility": "visible" + }, + "paint": { + "line-color": "hsla(0, 0%, 73%, 0.68)", + "line-dasharray": [ + 0.2, + 8 + ], + "line-width": { + "base": 1.4, + "stops": [ + [ + 14.5, + 0 + ], + [ + 15, + 2 + ], + [ + 20, + 6 + ] + ] + } + } + }, + { + "id": "railway", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "$type", + "LineString" + ], + [ + "all", + [ + "!has", + "service" + ], + [ + "!in", + "brunnel", + "bridge", + "tunnel" + ], + [ + "==", + "class", + "rail" + ] + ] + ], + "paint": { + "line-color": "#bbb", + "line-width": { + "base": 1.4, + "stops": [ + [ + 14, + 0.4 + ], + [ + 15, + 0.75 + ], + [ + 20, + 2 + ] + ] + } + } + }, + { + "id": "railway-hatching", + "type": "line", + "metadata": { + "mapbox:group": "1444849345966.4436" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "$type", + "LineString" + ], + [ + "all", + [ + "!has", + "service" + ], + [ + "!in", + "brunnel", + "bridge", + "tunnel" + ], + [ + "==", + "class", + "rail" + ] + ] + ], + "paint": { + "line-color": "#bbb", + "line-dasharray": [ + 0.2, + 8 + ], + "line-width": { + "base": 1.4, + "stops": [ + [ + 14.5, + 0 + ], + [ + 15, + 3 + ], + [ + 20, + 8 + ] + ] + } + } + }, + { + "id": "bridge-motorway-link-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849334699.1902" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "bridge" + ], + [ + "==", + "class", + "motorway_link" + ] + ], + "layout": { + "line-join": "round" + }, + "paint": { + "line-color": "#e9ac77", + "line-opacity": 1, + "line-width": { + "base": 1.2, + "stops": [ + [ + 12, + 1 + ], + [ + 13, + 3 + ], + [ + 14, + 4 + ], + [ + 20, + 15 + ] + ] + } + } + }, + { + "id": "bridge-link-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849334699.1902" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "bridge" + ], + [ + "in", + "class", + "primary_link", + "secondary_link", + "tertiary_link", + "trunk_link" + ] + ], + "layout": { + "line-join": "round" + }, + "paint": { + "line-color": "#e9ac77", + "line-opacity": 1, + "line-width": { + "base": 1.2, + "stops": [ + [ + 12, + 1 + ], + [ + 13, + 3 + ], + [ + 14, + 4 + ], + [ + 20, + 15 + ] + ] + } + } + }, + { + "id": "bridge-secondary-tertiary-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849334699.1902" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "bridge" + ], + [ + "in", + "class", + "secondary", + "tertiary" + ] + ], + "layout": { + "line-join": "round" + }, + "paint": { + "line-color": "#e9ac77", + "line-opacity": 1, + "line-width": { + "base": 1.2, + "stops": [ + [ + 8, + 1.5 + ], + [ + 20, + 28 + ] + ] + } + } + }, + { + "id": "bridge-trunk-primary-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849334699.1902" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "bridge" + ], + [ + "in", + "class", + "primary", + "trunk" + ] + ], + "layout": { + "line-join": "round" + }, + "paint": { + "line-color": "hsl(28, 76%, 67%)", + "line-width": { + "base": 1.2, + "stops": [ + [ + 5, + 0.4 + ], + [ + 6, + 0.6 + ], + [ + 7, + 1.5 + ], + [ + 20, + 26 + ] + ] + } + } + }, + { + "id": "bridge-motorway-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849334699.1902" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "bridge" + ], + [ + "==", + "class", + "motorway" + ] + ], + "layout": { + "line-join": "round" + }, + "paint": { + "line-color": "#e9ac77", + "line-width": { + "base": 1.2, + "stops": [ + [ + 5, + 0.4 + ], + [ + 6, + 0.6 + ], + [ + 7, + 1.5 + ], + [ + 20, + 22 + ] + ] + } + } + }, + { + "id": "bridge-path-casing", + "type": "line", + "metadata": { + "mapbox:group": "1444849334699.1902" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "$type", + "LineString" + ], + [ + "all", + [ + "==", + "brunnel", + "bridge" + ], + [ + "==", + "class", + "path" + ] + ] + ], + "paint": { + "line-color": "#f8f4f0", + "line-width": { + "base": 1.2, + "stops": [ + [ + 15, + 1.2 + ], + [ + 20, + 18 + ] + ] + } + } + }, + { + "id": "bridge-path", + "type": "line", + "metadata": { + "mapbox:group": "1444849334699.1902" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "$type", + "LineString" + ], + [ + "all", + [ + "==", + "brunnel", + "bridge" + ], + [ + "==", + "class", + "path" + ] + ] + ], + "paint": { + "line-color": "#cba", + "line-width": { + "base": 1.2, + "stops": [ + [ + 15, + 1.2 + ], + [ + 20, + 4 + ] + ] + }, + "line-dasharray": [ + 1.5, + 0.75 + ] + } + }, + { + "id": "bridge-motorway-link", + "type": "line", + "metadata": { + "mapbox:group": "1444849334699.1902" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "bridge" + ], + [ + "==", + "class", + "motorway_link" + ] + ], + "layout": { + "line-join": "round" + }, + "paint": { + "line-color": "#fc8", + "line-width": { + "base": 1.2, + "stops": [ + [ + 12.5, + 0 + ], + [ + 13, + 1.5 + ], + [ + 14, + 2.5 + ], + [ + 20, + 11.5 + ] + ] + } + } + }, + { + "id": "bridge-link", + "type": "line", + "metadata": { + "mapbox:group": "1444849334699.1902" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "bridge" + ], + [ + "in", + "class", + "primary_link", + "secondary_link", + "tertiary_link", + "trunk_link" + ] + ], + "layout": { + "line-join": "round" + }, + "paint": { + "line-color": "#fea", + "line-width": { + "base": 1.2, + "stops": [ + [ + 12.5, + 0 + ], + [ + 13, + 1.5 + ], + [ + 14, + 2.5 + ], + [ + 20, + 11.5 + ] + ] + } + } + }, + { + "id": "bridge-secondary-tertiary", + "type": "line", + "metadata": { + "mapbox:group": "1444849334699.1902" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "bridge" + ], + [ + "in", + "class", + "secondary", + "tertiary" + ] + ], + "layout": { + "line-join": "round" + }, + "paint": { + "line-color": "#fea", + "line-width": { + "base": 1.2, + "stops": [ + [ + 6.5, + 0 + ], + [ + 7, + 0.5 + ], + [ + 20, + 20 + ] + ] + } + } + }, + { + "id": "bridge-trunk-primary", + "type": "line", + "metadata": { + "mapbox:group": "1444849334699.1902" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "bridge" + ], + [ + "in", + "class", + "primary", + "trunk" + ] + ], + "layout": { + "line-join": "round" + }, + "paint": { + "line-color": "#fea", + "line-width": { + "base": 1.2, + "stops": [ + [ + 6.5, + 0 + ], + [ + 7, + 0.5 + ], + [ + 20, + 18 + ] + ] + } + } + }, + { + "id": "bridge-motorway", + "type": "line", + "metadata": { + "mapbox:group": "1444849334699.1902" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "bridge" + ], + [ + "==", + "class", + "motorway" + ] + ], + "layout": { + "line-join": "round" + }, + "paint": { + "line-color": "#fc8", + "line-width": { + "base": 1.2, + "stops": [ + [ + 6.5, + 0 + ], + [ + 7, + 0.5 + ], + [ + 20, + 18 + ] + ] + } + } + }, + { + "id": "bridge-railway", + "type": "line", + "metadata": { + "mapbox:group": "1444849334699.1902" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "bridge" + ], + [ + "==", + "class", + "rail" + ] + ], + "paint": { + "line-color": "#bbb", + "line-width": { + "base": 1.4, + "stops": [ + [ + 14, + 0.4 + ], + [ + 15, + 0.75 + ], + [ + 20, + 2 + ] + ] + } + } + }, + { + "id": "bridge-railway-hatching", + "type": "line", + "metadata": { + "mapbox:group": "1444849334699.1902" + }, + "source": "openmaptiles", + "source-layer": "transportation", + "filter": [ + "all", + [ + "==", + "brunnel", + "bridge" + ], + [ + "==", + "class", + "rail" + ] + ], + "paint": { + "line-color": "#bbb", + "line-dasharray": [ + 0.2, + 8 + ], + "line-width": { + "base": 1.4, + "stops": [ + [ + 14.5, + 0 + ], + [ + 15, + 3 + ], + [ + 20, + 8 + ] + ] + } + } + }, + { + "id": "cablecar", + "type": "line", + "source": "openmaptiles", + "source-layer": "transportation", + "minzoom": 13, + "filter": [ + "==", + "class", + "cable_car" + ], + "layout": { + "visibility": "visible", + "line-cap": "round" + }, + "paint": { + "line-color": "hsl(0, 0%, 70%)", + "line-width": { + "base": 1, + "stops": [ + [ + 11, + 1 + ], + [ + 19, + 2.5 + ] + ] + } + } + }, + { + "id": "cablecar-dash", + "type": "line", + "source": "openmaptiles", + "source-layer": "transportation", + "minzoom": 13, + "filter": [ + "==", + "class", + "cable_car" + ], + "layout": { + "visibility": "visible", + "line-cap": "round" + }, + "paint": { + "line-color": "hsl(0, 0%, 70%)", + "line-width": { + "base": 1, + "stops": [ + [ + 11, + 3 + ], + [ + 19, + 5.5 + ] + ] + }, + "line-dasharray": [ + 2, + 3 + ] + } + }, + { + "id": "boundary-land-level-4", + "type": "line", + "source": "openmaptiles", + "source-layer": "boundary", + "filter": [ + "all", + [ + ">=", + "admin_level", + 4 + ], + [ + "<=", + "admin_level", + 8 + ], + [ + "!=", + "maritime", + 1 + ] + ], + "layout": { + "line-join": "round" + }, + "paint": { + "line-color": "#9e9cab", + "line-dasharray": [ + 3, + 1, + 1, + 1 + ], + "line-width": { + "base": 1.4, + "stops": [ + [ + 4, + 0.4 + ], + [ + 5, + 1 + ], + [ + 12, + 3 + ] + ] + } + } + }, + { + "id": "boundary-land-level-2", + "type": "line", + "source": "openmaptiles", + "source-layer": "boundary", + "filter": [ + "all", + [ + "==", + "admin_level", + 2 + ], + [ + "!=", + "maritime", + 1 + ], + [ + "!=", + "disputed", + 1 + ] + ], + "layout": { + "line-cap": "round", + "line-join": "round" + }, + "paint": { + "line-color": "hsl(248, 7%, 66%)", + "line-width": { + "base": 1, + "stops": [ + [ + 0, + 0.6 + ], + [ + 4, + 1.4 + ], + [ + 5, + 2 + ], + [ + 12, + 8 + ] + ] + } + } + }, + { + "id": "boundary-land-disputed", + "type": "line", + "source": "openmaptiles", + "source-layer": "boundary", + "filter": [ + "all", + [ + "!=", + "maritime", + 1 + ], + [ + "==", + "disputed", + 1 + ] + ], + "layout": { + "line-cap": "round", + "line-join": "round" + }, + "paint": { + "line-color": "hsl(248, 7%, 70%)", + "line-dasharray": [ + 1, + 3 + ], + "line-width": { + "base": 1, + "stops": [ + [ + 0, + 0.6 + ], + [ + 4, + 1.4 + ], + [ + 5, + 2 + ], + [ + 12, + 8 + ] + ] + } + } + }, + { + "id": "boundary-water", + "type": "line", + "source": "openmaptiles", + "source-layer": "boundary", + "filter": [ + "all", + [ + "in", + "admin_level", + 2, + 4 + ], + [ + "==", + "maritime", + 1 + ] + ], + "layout": { + "line-cap": "round", + "line-join": "round" + }, + "paint": { + "line-color": "rgba(154, 189, 214, 1)", + "line-width": { + "base": 1, + "stops": [ + [ + 0, + 0.6 + ], + [ + 4, + 1.4 + ], + [ + 5, + 2 + ], + [ + 12, + 8 + ] + ] + }, + "line-opacity": { + "stops": [ + [ + 6, + 0.6 + ], + [ + 10, + 1 + ] + ] + } + } + }, + { + "id": "waterway-name", + "type": "symbol", + "source": "openmaptiles", + "source-layer": "waterway", + "minzoom": 13, + "filter": [ + "all", + [ + "==", + "$type", + "LineString" + ], + [ + "has", + "name" + ] + ], + "layout": { + "text-font": [ + "Noto Sans Italic" + ], + "text-size": 14, + "text-field": "{name:latin} {name:nonlatin}", + "text-max-width": 5, + "text-rotation-alignment": "map", + "symbol-placement": "line", + "text-letter-spacing": 0.2, + "symbol-spacing": 350 + }, + "paint": { + "text-color": "#74aee9", + "text-halo-width": 1.5, + "text-halo-color": "rgba(255,255,255,0.7)" + } + }, + { + "id": "water-name-lakeline", + "type": "symbol", + "source": "openmaptiles", + "source-layer": "water_name", + "filter": [ + "==", + "$type", + "LineString" + ], + "layout": { + "text-font": [ + "Noto Sans Italic" + ], + "text-size": 14, + "text-field": "{name:latin}\n{name:nonlatin}", + "text-max-width": 5, + "text-rotation-alignment": "map", + "symbol-placement": "line", + "symbol-spacing": 350, + "text-letter-spacing": 0.2 + }, + "paint": { + "text-color": "#74aee9", + "text-halo-width": 1.5, + "text-halo-color": "rgba(255,255,255,0.7)" + } + }, + { + "id": "water-name-ocean", + "type": "symbol", + "source": "openmaptiles", + "source-layer": "water_name", + "minzoom": 1.1, + "filter": [ + "all", + [ + "==", + "$type", + "Point" + ], + [ + "==", + "class", + "ocean" + ] + ], + "layout": { + "text-font": [ + "Noto Sans Italic" + ], + "text-size": 14, + "text-field": "{name:latin}", + "text-max-width": 5, + "text-rotation-alignment": "map", + "symbol-placement": "point", + "symbol-spacing": 350, + "text-letter-spacing": 0.2 + }, + "paint": { + "text-color": "#74aee9", + "text-halo-width": 1.5, + "text-halo-color": "rgba(255,255,255,0.7)" + } + }, + { + "id": "water-name-other", + "type": "symbol", + "source": "openmaptiles", + "source-layer": "water_name", + "minzoom": 1.1, + "filter": [ + "all", + [ + "==", + "$type", + "Point" + ], + [ + "!in", + "class", + "ocean" + ] + ], + "layout": { + "text-font": [ + "Noto Sans Italic" + ], + "text-size": { + "stops": [ + [ + 0, + 10 + ], + [ + 6, + 14 + ] + ] + }, + "text-field": "{name:latin}\n{name:nonlatin}", + "text-max-width": 5, + "text-rotation-alignment": "map", + "symbol-placement": "point", + "symbol-spacing": 350, + "text-letter-spacing": 0.2, + "visibility": "visible" + }, + "paint": { + "text-color": "#74aee9", + "text-halo-width": 1.5, + "text-halo-color": "rgba(255,255,255,0.7)" + } + }, + { + "id": "poi-level-3", + "type": "symbol", + "source": "openmaptiles", + "source-layer": "poi", + "minzoom": 16, + "filter": [ + "all", + [ + "==", + "$type", + "Point" + ], + [ + ">=", + "rank", + 25 + ] + ], + "layout": { + "text-padding": 2, + "text-font": [ + "Noto Sans Regular" + ], + "text-anchor": "top", + "icon-image": "{class}_11", + "text-field": "{name:latin}\n{name:nonlatin}", + "text-offset": [ + 0, + 0.6 + ], + "text-size": 12, + "text-max-width": 9 + }, + "paint": { + "text-halo-blur": 0.5, + "text-color": "#666", + "text-halo-width": 1, + "text-halo-color": "#ffffff" + } + }, + { + "id": "poi-level-2", + "type": "symbol", + "source": "openmaptiles", + "source-layer": "poi", + "minzoom": 15, + "filter": [ + "all", + [ + "==", + "$type", + "Point" + ], + [ + "<=", + "rank", + 24 + ], + [ + ">=", + "rank", + 15 + ] + ], + "layout": { + "text-padding": 2, + "text-font": [ + "Noto Sans Regular" + ], + "text-anchor": "top", + "icon-image": "{class}_11", + "text-field": "{name:latin}\n{name:nonlatin}", + "text-offset": [ + 0, + 0.6 + ], + "text-size": 12, + "text-max-width": 9 + }, + "paint": { + "text-halo-blur": 0.5, + "text-color": "#666", + "text-halo-width": 1, + "text-halo-color": "#ffffff" + } + }, + { + "id": "poi-level-1", + "type": "symbol", + "source": "openmaptiles", + "source-layer": "poi", + "minzoom": 14, + "filter": [ + "all", + [ + "==", + "$type", + "Point" + ], + [ + "<=", + "rank", + 14 + ], + [ + "has", + "name" + ] + ], + "layout": { + "text-padding": 2, + "text-font": [ + "Noto Sans Regular" + ], + "text-anchor": "top", + "icon-image": "{class}_11", + "text-field": "{name:latin}\n{name:nonlatin}", + "text-offset": [ + 0, + 0.6 + ], + "text-size": 12, + "text-max-width": 9 + }, + "paint": { + "text-halo-blur": 0.5, + "text-color": "#666", + "text-halo-width": 1, + "text-halo-color": "#ffffff" + } + }, + { + "id": "poi-railway", + "type": "symbol", + "source": "openmaptiles", + "source-layer": "poi", + "minzoom": 13, + "filter": [ + "all", + [ + "==", + "$type", + "Point" + ], + [ + "has", + "name" + ], + [ + "==", + "class", + "railway" + ], + [ + "==", + "subclass", + "station" + ] + ], + "layout": { + "text-padding": 2, + "text-font": [ + "Noto Sans Regular" + ], + "text-anchor": "top", + "icon-image": "{class}_11", + "text-field": "{name:latin}\n{name:nonlatin}", + "text-offset": [ + 0, + 0.6 + ], + "text-size": 12, + "text-max-width": 9, + "icon-optional": false, + "icon-ignore-placement": false, + "icon-allow-overlap": false, + "text-ignore-placement": false, + "text-allow-overlap": false, + "text-optional": true + }, + "paint": { + "text-halo-blur": 0.5, + "text-color": "#666", + "text-halo-width": 1, + "text-halo-color": "#ffffff" + } + }, + { + "id": "road_oneway", + "type": "symbol", + "source": "openmaptiles", + "source-layer": "transportation", + "minzoom": 15, + "filter": [ + "all", + [ + "==", + "oneway", + 1 + ], + [ + "in", + "class", + "motorway", + "trunk", + "primary", + "secondary", + "tertiary", + "minor", + "service" + ] + ], + "layout": { + "symbol-placement": "line", + "icon-image": "oneway", + "symbol-spacing": 75, + "icon-padding": 2, + "icon-rotation-alignment": "map", + "icon-rotate": 90, + "icon-size": { + "stops": [ + [ + 15, + 0.5 + ], + [ + 19, + 1 + ] + ] + } + }, + "paint": { + "icon-opacity": 0.5 + } + }, + { + "id": "road_oneway_opposite", + "type": "symbol", + "source": "openmaptiles", + "source-layer": "transportation", + "minzoom": 15, + "filter": [ + "all", + [ + "==", + "oneway", + -1 + ], + [ + "in", + "class", + "motorway", + "trunk", + "primary", + "secondary", + "tertiary", + "minor", + "service" + ] + ], + "layout": { + "symbol-placement": "line", + "icon-image": "oneway", + "symbol-spacing": 75, + "icon-padding": 2, + "icon-rotation-alignment": "map", + "icon-rotate": -90, + "icon-size": { + "stops": [ + [ + 15, + 0.5 + ], + [ + 19, + 1 + ] + ] + } + }, + "paint": { + "icon-opacity": 0.5 + } + }, + { + "id": "highway-name-path", + "type": "symbol", + "source": "openmaptiles", + "source-layer": "transportation_name", + "minzoom": 15.5, + "filter": [ + "==", + "class", + "path" + ], + "layout": { + "text-size": { + "base": 1, + "stops": [ + [ + 13, + 12 + ], + [ + 14, + 13 + ] + ] + }, + "text-font": [ + "Noto Sans Regular" + ], + "text-field": "{name:latin} {name:nonlatin}", + "symbol-placement": "line", + "text-rotation-alignment": "map" + }, + "paint": { + "text-halo-color": "#f8f4f0", + "text-color": "hsl(30, 23%, 62%)", + "text-halo-width": 0.5 + } + }, + { + "id": "highway-name-minor", + "type": "symbol", + "source": "openmaptiles", + "source-layer": "transportation_name", + "minzoom": 15, + "filter": [ + "all", + [ + "==", + "$type", + "LineString" + ], + [ + "in", + "class", + "minor", + "service", + "track" + ] + ], + "layout": { + "text-size": { + "base": 1, + "stops": [ + [ + 13, + 12 + ], + [ + 14, + 13 + ] + ] + }, + "text-font": [ + "Noto Sans Regular" + ], + "text-field": "{name:latin} {name:nonlatin}", + "symbol-placement": "line", + "text-rotation-alignment": "map" + }, + "paint": { + "text-halo-blur": 0.5, + "text-color": "#765", + "text-halo-width": 1 + } + }, + { + "id": "highway-name-major", + "type": "symbol", + "source": "openmaptiles", + "source-layer": "transportation_name", + "minzoom": 12.2, + "filter": [ + "in", + "class", + "primary", + "secondary", + "tertiary", + "trunk" + ], + "layout": { + "text-size": { + "base": 1, + "stops": [ + [ + 13, + 12 + ], + [ + 14, + 13 + ] + ] + }, + "text-font": [ + "Noto Sans Regular" + ], + "text-field": "{name:latin} {name:nonlatin}", + "symbol-placement": "line", + "text-rotation-alignment": "map" + }, + "paint": { + "text-halo-blur": 0.5, + "text-color": "#765", + "text-halo-width": 1 + } + }, + { + "id": "highway-shield", + "type": "symbol", + "source": "openmaptiles", + "source-layer": "transportation_name", + "minzoom": 8, + "filter": [ + "all", + [ + "<=", + "ref_length", + 6 + ], + [ + "==", + "$type", + "LineString" + ], + [ + "!in", + "network", + "us-interstate", + "us-highway", + "us-state" + ] + ], + "layout": { + "text-size": 10, + "icon-image": "road_{ref_length}", + "icon-rotation-alignment": "viewport", + "symbol-spacing": 200, + "text-font": [ + "Noto Sans Regular" + ], + "symbol-placement": { + "base": 1, + "stops": [ + [ + 10, + "point" + ], + [ + 11, + "line" + ] + ] + }, + "text-rotation-alignment": "viewport", + "icon-size": 1, + "text-field": "{ref}" + }, + "paint": {} + }, + { + "id": "highway-shield-us-interstate", + "type": "symbol", + "source": "openmaptiles", + "source-layer": "transportation_name", + "minzoom": 7, + "filter": [ + "all", + [ + "<=", + "ref_length", + 6 + ], + [ + "==", + "$type", + "LineString" + ], + [ + "in", + "network", + "us-interstate" + ] + ], + "layout": { + "text-size": 10, + "icon-image": "{network}_{ref_length}", + "icon-rotation-alignment": "viewport", + "symbol-spacing": 200, + "text-font": [ + "Noto Sans Regular" + ], + "symbol-placement": { + "base": 1, + "stops": [ + [ + 7, + "point" + ], + [ + 7, + "line" + ], + [ + 8, + "line" + ] + ] + }, + "text-rotation-alignment": "viewport", + "icon-size": 1, + "text-field": "{ref}" + }, + "paint": { + "text-color": "rgba(0, 0, 0, 1)" + } + }, + { + "id": "highway-shield-us-other", + "type": "symbol", + "source": "openmaptiles", + "source-layer": "transportation_name", + "minzoom": 9, + "filter": [ + "all", + [ + "<=", + "ref_length", + 6 + ], + [ + "==", + "$type", + "LineString" + ], + [ + "in", + "network", + "us-highway", + "us-state" + ] + ], + "layout": { + "text-size": 10, + "icon-image": "{network}_{ref_length}", + "icon-rotation-alignment": "viewport", + "symbol-spacing": 200, + "text-font": [ + "Noto Sans Regular" + ], + "symbol-placement": { + "base": 1, + "stops": [ + [ + 10, + "point" + ], + [ + 11, + "line" + ] + ] + }, + "text-rotation-alignment": "viewport", + "icon-size": 1, + "text-field": "{ref}" + }, + "paint": { + "text-color": "rgba(0, 0, 0, 1)" + } + }, + { + "id": "airport-label-major", + "type": "symbol", + "source": "openmaptiles", + "source-layer": "aerodrome_label", + "minzoom": 10, + "filter": [ + "all", + [ + "has", + "iata" + ] + ], + "layout": { + "text-padding": 2, + "text-font": [ + "Noto Sans Regular" + ], + "text-anchor": "top", + "icon-image": "airport_11", + "text-field": "{name:latin}\n{name:nonlatin}", + "text-offset": [ + 0, + 0.6 + ], + "text-size": 12, + "text-max-width": 9, + "visibility": "visible", + "icon-size": 1, + "text-optional": true + }, + "paint": { + "text-halo-blur": 0.5, + "text-color": "#666", + "text-halo-width": 1, + "text-halo-color": "#ffffff" + } + }, + { + "id": "place-other", + "type": "symbol", + "metadata": { + "mapbox:group": "1444849242106.713" + }, + "source": "openmaptiles", + "source-layer": "place", + "filter": [ + "!in", + "class", + "city", + "town", + "village", + "country", + "continent" + ], + "layout": { + "text-letter-spacing": 0.1, + "text-size": { + "base": 1.2, + "stops": [ + [ + 12, + 10 + ], + [ + 15, + 14 + ] + ] + }, + "text-font": [ + "Noto Sans Bold" + ], + "text-field": "{name:latin}\n{name:nonlatin}", + "text-transform": "uppercase", + "text-max-width": 9, + "visibility": "visible" + }, + "paint": { + "text-color": "#633", + "text-halo-width": 1.2, + "text-halo-color": "rgba(255,255,255,0.8)" + } + }, + { + "id": "place-village", + "type": "symbol", + "metadata": { + "mapbox:group": "1444849242106.713" + }, + "source": "openmaptiles", + "source-layer": "place", + "filter": [ + "==", + "class", + "village" + ], + "layout": { + "text-font": [ + "Noto Sans Regular" + ], + "text-size": { + "base": 1.2, + "stops": [ + [ + 10, + 12 + ], + [ + 15, + 22 + ] + ] + }, + "text-field": "{name:latin}\n{name:nonlatin}", + "text-max-width": 8, + "visibility": "visible" + }, + "paint": { + "text-color": "#333", + "text-halo-width": 1.2, + "text-halo-color": "rgba(255,255,255,0.8)" + } + }, + { + "id": "place-town", + "type": "symbol", + "metadata": { + "mapbox:group": "1444849242106.713" + }, + "source": "openmaptiles", + "source-layer": "place", + "filter": [ + "==", + "class", + "town" + ], + "layout": { + "text-font": [ + "Noto Sans Regular" + ], + "text-size": { + "base": 1.2, + "stops": [ + [ + 10, + 14 + ], + [ + 15, + 24 + ] + ] + }, + "text-field": "{name:latin}\n{name:nonlatin}", + "text-max-width": 8, + "visibility": "visible" + }, + "paint": { + "text-color": "#333", + "text-halo-width": 1.2, + "text-halo-color": "rgba(255,255,255,0.8)" + } + }, + { + "id": "place-city", + "type": "symbol", + "metadata": { + "mapbox:group": "1444849242106.713" + }, + "source": "openmaptiles", + "source-layer": "place", + "filter": [ + "all", + [ + "!=", + "capital", + 2 + ], + [ + "==", + "class", + "city" + ] + ], + "layout": { + "text-font": [ + "Noto Sans Regular" + ], + "text-size": { + "base": 1.2, + "stops": [ + [ + 7, + 14 + ], + [ + 11, + 24 + ] + ] + }, + "text-field": "{name:latin}\n{name:nonlatin}", + "text-max-width": 8, + "visibility": "visible" + }, + "paint": { + "text-color": "#333", + "text-halo-width": 1.2, + "text-halo-color": "rgba(255,255,255,0.8)" + } + }, + { + "id": "place-city-capital", + "type": "symbol", + "metadata": { + "mapbox:group": "1444849242106.713" + }, + "source": "openmaptiles", + "source-layer": "place", + "filter": [ + "all", + [ + "==", + "capital", + 2 + ], + [ + "==", + "class", + "city" + ] + ], + "layout": { + "text-font": [ + "Noto Sans Regular" + ], + "text-size": { + "base": 1.2, + "stops": [ + [ + 7, + 14 + ], + [ + 11, + 24 + ] + ] + }, + "text-field": "{name:latin}\n{name:nonlatin}", + "text-max-width": 8, + "icon-image": "star_11", + "text-offset": [ + 0.4, + 0 + ], + "icon-size": 0.8, + "text-anchor": "left", + "visibility": "visible" + }, + "paint": { + "text-color": "#333", + "text-halo-width": 1.2, + "text-halo-color": "rgba(255,255,255,0.8)" + } + }, + { + "id": "place-country-other", + "type": "symbol", + "metadata": { + "mapbox:group": "1444849242106.713" + }, + "source": "openmaptiles", + "source-layer": "place", + "minzoom": 1.1, + "filter": [ + "all", + [ + "==", + "class", + "country" + ], + [ + ">=", + "rank", + 3 + ], + [ + "!has", + "iso_a2" + ] + ], + "layout": { + "text-font": [ + "Noto Sans Italic" + ], + "text-field": "{name_en}", + "text-size": { + "stops": [ + [ + 3, + 11 + ], + [ + 7, + 17 + ] + ] + }, + "text-transform": "uppercase", + "text-max-width": 6.25, + "visibility": "visible" + }, + "paint": { + "text-halo-blur": 1, + "text-color": "#334", + "text-halo-width": 2, + "text-halo-color": "rgba(255,255,255,0.8)" + } + }, + { + "id": "place-country-3", + "type": "symbol", + "metadata": { + "mapbox:group": "1444849242106.713" + }, + "source": "openmaptiles", + "source-layer": "place", + "minzoom": 1.1, + "filter": [ + "all", + [ + "==", + "class", + "country" + ], + [ + ">=", + "rank", + 3 + ], + [ + "has", + "iso_a2" + ] + ], + "layout": { + "text-font": [ + "Noto Sans Bold" + ], + "text-field": "{name_en}", + "text-size": { + "stops": [ + [ + 3, + 11 + ], + [ + 7, + 17 + ] + ] + }, + "text-transform": "uppercase", + "text-max-width": 6.25, + "visibility": "visible" + }, + "paint": { + "text-halo-blur": 1, + "text-color": "#334", + "text-halo-width": 2, + "text-halo-color": "rgba(255,255,255,0.8)" + } + }, + { + "id": "place-country-2", + "type": "symbol", + "metadata": { + "mapbox:group": "1444849242106.713" + }, + "source": "openmaptiles", + "source-layer": "place", + "minzoom": 1.1, + "filter": [ + "all", + [ + "==", + "class", + "country" + ], + [ + "==", + "rank", + 2 + ], + [ + "has", + "iso_a2" + ] + ], + "layout": { + "text-font": [ + "Noto Sans Bold" + ], + "text-field": "{name_en}", + "text-size": { + "stops": [ + [ + 2, + 11 + ], + [ + 5, + 17 + ] + ] + }, + "text-transform": "uppercase", + "text-max-width": 6.25, + "visibility": "visible" + }, + "paint": { + "text-halo-blur": 1, + "text-color": "#334", + "text-halo-width": 2, + "text-halo-color": "rgba(255,255,255,0.8)" + } + }, + { + "id": "place-country-1", + "type": "symbol", + "metadata": { + "mapbox:group": "1444849242106.713" + }, + "source": "openmaptiles", + "source-layer": "place", + "minzoom": 1.1, + "filter": [ + "all", + [ + "==", + "class", + "country" + ], + [ + "==", + "rank", + 1 + ], + [ + "has", + "iso_a2" + ] + ], + "layout": { + "text-font": [ + "Noto Sans Bold" + ], + "text-field": "{name_en}", + "text-size": { + "stops": [ + [ + 1, + 11 + ], + [ + 4, + 17 + ] + ] + }, + "text-transform": "uppercase", + "text-max-width": 6.25, + "visibility": "visible" + }, + "paint": { + "text-halo-blur": 1, + "text-color": "#334", + "text-halo-width": 2, + "text-halo-color": "rgba(255,255,255,0.8)" + } + }, + { + "id": "place-continent", + "type": "symbol", + "metadata": { + "mapbox:group": "1444849242106.713" + }, + "source": "openmaptiles", + "source-layer": "place", + "maxzoom": 1.1, + "filter": [ + "==", + "class", + "continent" + ], + "layout": { + "text-font": [ + "Noto Sans Bold" + ], + "text-field": "{name_en}", + "text-size": 14, + "text-max-width": 6.25, + "text-transform": "uppercase", + "visibility": "visible" + }, + "paint": { + "text-halo-blur": 1, + "text-color": "#334", + "text-halo-width": 2, + "text-halo-color": "rgba(255,255,255,0.8)" + } + } + ], + "id": "osm-bright", + "maxzoom": 10 +}; diff --git a/x-pack/legacy/plugins/maps/public/layers/vector_tile_layer.js b/x-pack/legacy/plugins/maps/public/layers/vector_tile_layer.js new file mode 100644 index 0000000000000..71a47d8c066ea --- /dev/null +++ b/x-pack/legacy/plugins/maps/public/layers/vector_tile_layer.js @@ -0,0 +1,203 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +import { TileLayer } from './tile_layer'; +import _ from 'lodash'; +import { TileStyle } from '../layers/styles/tile_style'; +import { MB_SOURCE_ID_LAYER_ID_PREFIX_DELIMITER, SOURCE_DATA_ID_ORIGIN } from '../../common/constants'; + + + +const MB_STYLE_TYPE_TO_OPACITY = { + 'fill': ['fill-opacity'], + 'line': ['line-opacity'], + 'circle': ['circle-opacity'], + 'background': ['background-opacity'], + 'symbol': ['icon-opacity', 'text-opacity'] +}; + + + +export class VectorTileLayer extends TileLayer { + + static type = 'VECTOR_TILE'; + + constructor({ layerDescriptor, source, style }) { + super({ layerDescriptor, source, style }); + } + + static createDescriptor(options) { + const tileLayerDescriptor = super.createDescriptor(options); + tileLayerDescriptor.type = VectorTileLayer.type; + tileLayerDescriptor.alpha = _.get(options, 'alpha', 1); + tileLayerDescriptor.style = + TileStyle.createDescriptor(tileLayerDescriptor.style.properties); + return tileLayerDescriptor; + } + + _generateMbLayerId(mbLayer) { + return this._getMbSourceId() + MB_SOURCE_ID_LAYER_ID_PREFIX_DELIMITER + mbLayer.id; + } + + getMbLayerIds() { + const sourceDataRequest = this.getSourceDataRequest(); + if (!sourceDataRequest) {//data is immmutable + return []; + } + + const vectorStyle = sourceDataRequest.getData(); + const layerIds = vectorStyle.layers.map(layer => { + return this._generateMbLayerId(layer); + }); + return layerIds; + } + + _getMbSourceId() { + return this.getId(); + } + + async syncData({ startLoading, stopLoading, onLoadError, dataFilters }) { + if (!this.isVisible() || !this.showAtZoomLevel(dataFilters.zoom)) { + return; + } + const sourceDataRequest = this.getSourceDataRequest(); + if (sourceDataRequest) {//data is immmutable + return; + } + const requestToken = Symbol(`layer-source-refresh:${ this.getId()} - source`); + startLoading(SOURCE_DATA_ID_ORIGIN, requestToken, dataFilters); + try { + const vectorStyle = await this._source.getVectorStyle(); + stopLoading(SOURCE_DATA_ID_ORIGIN, requestToken, vectorStyle, {}); + } catch(error) { + onLoadError(SOURCE_DATA_ID_ORIGIN, requestToken, error.message); + } + } + + _getStyleFle() { + const sourceDataRequest = this.getSourceDataRequest(); + if (!sourceDataRequest) { + //this is possible if the layer was invisible at startup. + //the actions will not perform any data=syncing as an optimization when a layer is invisible + //when turning the layer back into visible, it's possible the url has not been resovled yet. + return; + } + return sourceDataRequest.getData(); + } + + syncLayerWithMB(mbMap) { + + const sourceId = this._getMbSourceId(); + const source = mbMap.getSource(sourceId); + + if (!source) { + + + const vectorStyle = this._getStyleFle(); + if (!vectorStyle) { + return; + } + + //assume single source + const sourceIds = Object.keys(vectorStyle.sources); + const firstSourceName = sourceIds[0]; + + window._style = vectorStyle; + + mbMap.addSource(sourceId, { + type: 'vector', + url: vectorStyle.sources[firstSourceName].url + }); + + vectorStyle.layers.forEach(layer => { + const newLayerObject = { + ...layer, + source: this._getMbSourceId(), + id: this._generateMbLayerId(layer) + }; + try { + mbMap.addLayer(newLayerObject); + } catch(e) { + console.error(e); + } + }); + + } + + this._setTileLayerProperties(mbMap); + + } + + + _setOpacityForType(mbMap, mbLayer, mbLayerId) { + + + const opacityProps = MB_STYLE_TYPE_TO_OPACITY[mbLayer.type]; + if (!opacityProps) { + //don't know what to do + return; + } + + opacityProps.forEach(opacityProp => { + if (mbLayer.paint && typeof mbLayer.paint[opacityProp] === 'number') { + const newOpacity = (mbLayer.paint[opacityProp] / 1) * this.getAlpha(); + mbMap.setPaintProperty(mbLayerId, opacityProp, newOpacity); + } else { + mbMap.setPaintProperty(mbLayerId, opacityProp, this.getAlpha()); + } + }); + + } + + + _setTileLayerProperties(mbMap) { + + const vectorStyle = this._getStyleFle(); + if (!vectorStyle) { + return; + } + + const style = mbMap.getStyle(); + if (!style || !style.layers) { + return; + } + + + + vectorStyle.layers.forEach(mbLayer => { + + const mbLayerId = this._generateMbLayerId(mbLayer); + + try { + mbMap.setLayoutProperty(mbLayerId, 'visibility', this.isVisible() ? 'visible' : 'none'); + + + let minZoom = this._descriptor.minZoom; + if (typeof mbLayer.minzoom === 'number') { + minZoom = Math.max(minZoom, mbLayer.minzoom); + } + + let maxZoom = this._descriptor.maxZoom; + if (typeof mbLayer.maxzoom === 'number') { + maxZoom = Math.min(maxZoom, mbLayer.maxzoom); + } + + mbMap.setLayerZoomRange(mbLayerId, minZoom, maxZoom); + + + this._setOpacityForType(mbMap, mbLayer, mbLayerId); + + + } catch(e) { + console.error(e); + } + + }); + + + } + +} diff --git a/x-pack/legacy/plugins/maps/public/selectors/map_selectors.js b/x-pack/legacy/plugins/maps/public/selectors/map_selectors.js index 0cffed7a51a41..7adb420c450a4 100644 --- a/x-pack/legacy/plugins/maps/public/selectors/map_selectors.js +++ b/x-pack/legacy/plugins/maps/public/selectors/map_selectors.js @@ -7,6 +7,7 @@ import { createSelector } from 'reselect'; import _ from 'lodash'; import { TileLayer } from '../layers/tile_layer'; +import { VectorTileLayer } from '../layers/vector_tile_layer'; import { VectorLayer } from '../layers/vector_layer'; import { HeatmapLayer } from '../layers/heatmap_layer'; import { ALL_SOURCES } from '../layers/sources/all_sources'; @@ -21,6 +22,8 @@ function createLayerInstance(layerDescriptor, inspectorAdapters) { const source = createSourceInstance(layerDescriptor.sourceDescriptor, inspectorAdapters); const style = createStyleInstance(layerDescriptor.style, source); switch (layerDescriptor.type) { + case VectorTileLayer.type: + return new VectorTileLayer({ layerDescriptor, source, style }); case TileLayer.type: return new TileLayer({ layerDescriptor, source, style }); case VectorLayer.type: @@ -42,7 +45,6 @@ function createSourceInstance(sourceDescriptor, inspectorAdapters) { return new Source(sourceDescriptor, inspectorAdapters); } - function createStyleInstance(styleDescriptor, source) { if (!styleDescriptor || !styleDescriptor.type) {