From 98fc2d0749055a132f7e00cbae4333ee83f3eb9b Mon Sep 17 00:00:00 2001 From: Anton Tananaev Date: Sun, 20 Jun 2021 19:21:47 -0700 Subject: Add current location support --- web/app/view/map/MapMarkerController.js | 49 +++++++++++++++++++++++++++++++++ 1 file changed, 49 insertions(+) (limited to 'web/app/view/map/MapMarkerController.js') 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) { -- cgit v1.2.3