diff options
-rw-r--r-- | web/app/Style.js | 2 | ||||
-rw-r--r-- | web/app/store/MapTypes.js | 12 | ||||
-rw-r--r-- | web/app/view/map/BaseMap.js | 84 | ||||
-rw-r--r-- | web/l10n/en.json | 4 | ||||
-rw-r--r-- | web/load.js | 9 |
5 files changed, 103 insertions, 8 deletions
diff --git a/web/app/Style.js b/web/app/Style.js index aa749ce9..418ba424 100644 --- a/web/app/Style.js +++ b/web/app/Style.js @@ -68,7 +68,7 @@ Ext.define('Traccar.Style', { mapScaleNormal: 1, mapScaleSelected: 1.5, - mapMaxZoom: 19, + mapMaxZoom: 18, mapDelay: 500, mapAccuracyColor: 'rgba(96, 96, 96, 1.0)', diff --git a/web/app/store/MapTypes.js b/web/app/store/MapTypes.js index dba506dd..77c10ebd 100644 --- a/web/app/store/MapTypes.js +++ b/web/app/store/MapTypes.js @@ -32,6 +32,18 @@ Ext.define('Traccar.store.MapTypes', { key: 'bingAerial', name: Strings.mapBingAerial }, { + key: 'bingHybrid', + name: Strings.mapBingHybrid + }, { + key: 'baidu', + name: Strings.mapBaidu + }, { + key: 'yandexMap', + name: Strings.mapYandexMap + }, { + key: 'yandexSat', + name: Strings.mapYandexSat + }, { key: 'custom', name: Strings.mapCustom }] diff --git a/web/app/view/map/BaseMap.js b/web/app/view/map/BaseMap.js index ac3b2694..ace0d82d 100644 --- a/web/app/view/map/BaseMap.js +++ b/web/app/view/map/BaseMap.js @@ -62,19 +62,85 @@ Ext.define('Traccar.view.map.BaseMap', { imagerySet: 'Aerial' }) }); + } else if (type === 'bingHybrid') { + layer = new ol.layer.Tile({ + source: new ol.source.BingMaps({ + key: bingKey, + imagerySet: 'AerialWithLabels' + }) + }); } else if (type === 'osm') { layer = new ol.layer.Tile({ source: new ol.source.OSM({}) }); + } else if (type === 'baidu') { + layer = new ol.layer.Tile({ + source: new ol.source.XYZ({ + projection: 'BD-MC', + tileUrlFunction: function (tileCoord) { + var URLS_LENGTH = 5; + + var x = tileCoord[1]; + var y = tileCoord[2]; + var z = tileCoord[0]; + + var hash = (x << z) + y; + var index = hash % URLS_LENGTH; + index = index < 0 ? index + URLS_LENGTH : index; + + if (x < 0) { + x = 'M' + (-x) + } + if (y < 0) { + y = 'M' + (-y) + } + return 'http://online{}.map.bdimg.com/onlinelabel/?qt=tile&x={x}&y={y}&z={z}&styles=pl' + .replace('{}', index).replace('{x}', x).replace('{y}', y).replace('{z}', z); + }, + tileGrid: new ol.tilegrid.TileGrid({ + extent: ol.proj.transformExtent([-180, -74, 180, 74], 'EPSG:4326', 'BD-MC'), + origin: [0, 0], + minZoom: 3, + resolutions: [ + 262144, 131072, 65536, 32768, 16384, 8192, 4096, 2048, + 1024, 512, 256, 128, 64, 32, 16, 8, 4, 2, 1, 0.5 + ] + }), + attributions: [ + new ol.Attribution({ + html: '© <a href="http://map.baidu.com/">Baidu</a>' + }) + ] + }) + }); + } else if (type === 'yandexMap') { + layer = new ol.layer.Tile({ + source: new ol.source.XYZ({ + url: 'https://vec0{1-4}.maps.yandex.net/tiles?l=map&x={x}&y={y}&z={z}', + projection: 'EPSG:3395', + attributions: [ + new ol.Attribution({ + html: '© <a href="https://yandex.com/maps/">Yandex</a>' + }) + ] + }) + }); + } else if (type === 'yandexSat') { + layer = new ol.layer.Tile({ + source: new ol.source.XYZ({ + url: 'https://sat0{1-4}.maps.yandex.net/tiles?l=sat&x={x}&y={y}&z={z}', + projection: 'EPSG:3395', + attributions: [ + new ol.Attribution({ + html: '© <a href="https://yandex.com/maps/">Yandex</a>' + }) + ] + }) + }); } else { layer = new ol.layer.Tile({ source: new ol.source.XYZ({ - urls: [ - 'https://cartodb-basemaps-a.global.ssl.fastly.net/light_all/{z}/{x}/{y}.png', - 'https://cartodb-basemaps-b.global.ssl.fastly.net/light_all/{z}/{x}/{y}.png', - 'https://cartodb-basemaps-c.global.ssl.fastly.net/light_all/{z}/{x}/{y}.png', - 'https://cartodb-basemaps-d.global.ssl.fastly.net/light_all/{z}/{x}/{y}.png' - ], + url: 'https://cartodb-basemaps-{a-d}.global.ssl.fastly.net/light_all/{z}/{x}/{y}.png', attributions: [ new ol.Attribution({ html: [ @@ -143,4 +209,10 @@ Ext.define('Traccar.view.map.BaseMap', { this.map.updateSize(); } } +}, function () { + + proj4.defs('BD-MC','+proj=merc +lon_0=0 +units=m +ellps=clrk66 +no_defs'); + proj4.defs('EPSG:3395', '+proj=merc +lon_0=0 +k=1 +x_0=0 +y_0=0 +datum=WGS84 +units=m +no_defs'); + ol.proj.get('EPSG:3395').setExtent([-20037508.342789244, -20037508.342789244, 20037508.342789244, 20037508.342789244]); + }); diff --git a/web/l10n/en.json b/web/l10n/en.json index f494978f..a810943b 100644 --- a/web/l10n/en.json +++ b/web/l10n/en.json @@ -132,6 +132,10 @@ "mapBingKey": "Bing Maps Key", "mapBingRoad": "Bing Maps Road", "mapBingAerial": "Bing Maps Aerial", + "mapBingHybrid": "Bing Maps Hybrid", + "mapBaidu": "Baidu", + "mapYandexMap": "Yandex Map", + "mapYandexSat": "Yandex Satellite", "mapShapePolygon": "Polygon", "mapShapeCircle": "Circle", "mapShapePolyline": "Polyline", diff --git a/web/load.js b/web/load.js index fc676b76..4baa6901 100644 --- a/web/load.js +++ b/web/load.js @@ -1,5 +1,5 @@ (function () { - var debugMode, touchMode, locale, localeParameter, extjsVersion, fontAwesomeVersion, olVersion, i, language, languages; + var debugMode, touchMode, locale, localeParameter, extjsVersion, proj4jsVersion, fontAwesomeVersion, olVersion, i, language, languages; function addStyleFile(file) { var link = document.createElement('link'); @@ -120,6 +120,7 @@ extjsVersion = '6.2.0'; fontAwesomeVersion = '4.7.0'; olVersion = '4.0.0'; + proj4jsVersion = '2.4.3'; if (debugMode) { addScriptFile('//cdnjs.cloudflare.com/ajax/libs/extjs/' + extjsVersion + '/ext-all-debug.js'); @@ -144,6 +145,12 @@ addScriptFile('//cdnjs.cloudflare.com/ajax/libs/ol3/' + olVersion + '/ol.js'); } + if (debugMode) { + addScriptFile('//cdnjs.cloudflare.com/ajax/libs/proj4js/' + proj4jsVersion + '/proj4-src.js'); + } else { + addScriptFile('//cdnjs.cloudflare.com/ajax/libs/proj4js/' + proj4jsVersion + '/proj4.js'); + } + addSvgFile('images/default.svg', 'defaultSvg'); addSvgFile('images/arrow.svg', 'arrowSvg'); addSvgFile('images/car.svg', 'carSvg'); |