diff options
Diffstat (limited to 'web/app')
-rw-r--r-- | web/app/view/map/BaseMap.js | 4 | ||||
-rw-r--r-- | web/app/view/map/Map.js | 4 | ||||
-rw-r--r-- | web/app/view/map/MapMarkerController.js | 49 |
3 files changed, 57 insertions, 0 deletions
diff --git a/web/app/view/map/BaseMap.js b/web/app/view/map/BaseMap.js index 403df94..42ea43a 100644 --- a/web/app/view/map/BaseMap.js +++ b/web/app/view/map/BaseMap.js @@ -217,6 +217,10 @@ Ext.define('Traccar.view.map.BaseMap', { self.fireEvent('deselectfeature'); } }); + + this.map.once('postrender', function (event) { + self.fireEvent('mapready'); + }); }, listeners: { diff --git a/web/app/view/map/Map.js b/web/app/view/map/Map.js index e906e6c..fbaa758 100644 --- a/web/app/view/map/Map.js +++ b/web/app/view/map/Map.js @@ -66,6 +66,10 @@ Ext.define('Traccar.view.map.Map', { stateId: 'show-geofences-button', tooltip: Strings.sharedGeofences }, { + handler: 'showCurrentLocation', + glyph: 'xf124@FontAwesome', + tooltip: Strings.mapCurrentLocation + }, { handler: 'showLiveRoutes', reference: 'showLiveRoutes', glyph: 'xf1b0@FontAwesome', diff --git a/web/app/view/map/MapMarkerController.js b/web/app/view/map/MapMarkerController.js index 785fcc6..2ef4c3a 100644 --- a/web/app/view/map/MapMarkerController.js +++ b/web/app/view/map/MapMarkerController.js @@ -66,6 +66,7 @@ Ext.define('Traccar.view.map.MapMarkerController', { }, component: { '#': { + mapready: 'initGeolocation', selectfeature: 'selectFeature', deselectfeature: 'deselectFeature' } @@ -82,6 +83,54 @@ Ext.define('Traccar.view.map.MapMarkerController', { this.selectZoom = Traccar.app.getAttributePreference('web.selectZoom', 0); }, + initGeolocation: function () { + var geolocation, accuracyFeature, positionFeature; + + geolocation = new ol.Geolocation({ + trackingOptions: { + enableHighAccuracy: true + }, + projection: this.getView().getMapView().getProjection() + }); + + geolocation.on('error', function (error) { + Traccar.app.showError(error.message); + }); + + accuracyFeature = new ol.Feature(); + geolocation.on('change:accuracyGeometry', function () { + accuracyFeature.setGeometry(geolocation.getAccuracyGeometry()); + }); + + positionFeature = new ol.Feature(); + positionFeature.setStyle(new ol.style.Style({ + image: new ol.style.Circle({ + radius: 6, + fill: new ol.style.Fill({ + color: '#3399CC', + }), + stroke: new ol.style.Stroke({ + color: '#fff', + width: 2, + }) + }) + })); + + geolocation.on('change:position', function () { + var coordinates = geolocation.getPosition(); + positionFeature.setGeometry(coordinates ? new ol.geom.Point(coordinates) : null); + }); + + this.getView().getAccuracySource().addFeature(accuracyFeature); + this.getView().getMarkersSource().addFeature(positionFeature); + + this.geolocation = geolocation; + }, + + showCurrentLocation: function (view) { + this.geolocation.setTracking(view.pressed); + }, + getAreaStyle: function (label, color) { var fillColor, strokeColor, styleConfig; if (color) { |