diff options
author | Anton Tananaev <anton.tananaev@gmail.com> | 2016-07-03 12:39:55 +1200 |
---|---|---|
committer | Anton Tananaev <anton.tananaev@gmail.com> | 2016-07-03 12:39:55 +1200 |
commit | bac0d9090c1a8906f7d3c0a56da58c33495fd6db (patch) | |
tree | 2ce9845d6accc54369df79e97bf9f30526f53153 /web/app/view/BaseMap.js | |
parent | 8e725d35d9a55bdb4b17002a41231203fabee359 (diff) | |
download | traccar-server-bac0d9090c1a8906f7d3c0a56da58c33495fd6db.tar.gz traccar-server-bac0d9090c1a8906f7d3c0a56da58c33495fd6db.tar.bz2 traccar-server-bac0d9090c1a8906f7d3c0a56da58c33495fd6db.zip |
Create base map panel
Diffstat (limited to 'web/app/view/BaseMap.js')
-rw-r--r-- | web/app/view/BaseMap.js | 118 |
1 files changed, 118 insertions, 0 deletions
diff --git a/web/app/view/BaseMap.js b/web/app/view/BaseMap.js new file mode 100644 index 000000000..c2a889188 --- /dev/null +++ b/web/app/view/BaseMap.js @@ -0,0 +1,118 @@ +/* + * Copyright 2016 Anton Tananaev (anton.tananaev@gmail.com) + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +Ext.define('Traccar.view.BaseMap', { + extend: 'Ext.form.Panel', + xtype: 'baseMapView', + + title: Strings.mapTitle, + layout: 'fit', + + getMap: function () { + return this.map; + }, + + getMapView: function () { + return this.mapView; + }, + + initMap: function() { + var user, server, layer, type, bingKey, lat, lon, zoom, target; + + user = Traccar.app.getUser(); + server = Traccar.app.getServer(); + + type = user.get('map') || server.get('map'); + bingKey = server.get('bingKey'); + + if (type === 'custom') { + layer = new ol.layer.Tile({ + source: new ol.source.XYZ({ + url: server.get('mapUrl'), + attributions: [new ol.Attribution({ + html: '' + })] + }) + }); + } else if (type === 'bingRoad') { + layer = new ol.layer.Tile({ + source: new ol.source.BingMaps({ + key: bingKey, + imagerySet: 'Road' + }) + }); + } else if (type === 'bingAerial') { + layer = new ol.layer.Tile({ + source: new ol.source.BingMaps({ + key: bingKey, + imagerySet: 'Aerial' + }) + }); + } else { + layer = new ol.layer.Tile({ + source: new ol.source.OSM({}) + }); + } + + lat = user.get('latitude') || server.get('latitude') || Traccar.Style.mapDefaultLat; + lon = user.get('longitude') || server.get('longitude') || Traccar.Style.mapDefaultLon; + zoom = user.get('zoom') || server.get('zoom') || Traccar.Style.mapDefaultZoom; + + this.mapView = new ol.View({ + center: ol.proj.fromLonLat([lon, lat]), + zoom: zoom, + maxZoom: Traccar.Style.mapMaxZoom + }); + + this.map = new ol.Map({ + target: this.body.dom.id, + layers: [layer], + view: this.mapView + }); + + target = this.map.getTarget(); + if (typeof target === 'string') { + target = Ext.get(target).dom; + } + + this.map.on('pointermove', function (e) { + var hit = this.forEachFeatureAtPixel(e.pixel, function (feature, layer) { + return true; + }); + if (hit) { + target.style.cursor = 'pointer'; + } else { + target.style.cursor = ''; + } + }); + + this.map.on('click', function (e) { + this.map.forEachFeatureAtPixel(e.pixel, function (feature, layer) { + this.fireEvent('selectFeature', feature); + }, this); + }, this); + }, + + listeners: { + afterrender: function () { + this.initMap(); + }, + + resize: function () { + this.map.updateSize(); + } + } +}); |