diff options
| -rw-r--r-- | web/app/Style.js | 2 | ||||
| -rw-r--r-- | web/app/view/GeofenceDialog.js | 5 | ||||
| -rw-r--r-- | web/app/view/GeofenceMap.js | 6 | ||||
| -rw-r--r-- | web/app/view/MapController.js | 18 |
4 files changed, 23 insertions, 8 deletions
diff --git a/web/app/Style.js b/web/app/Style.js index 4a77f561..302e6d4c 100644 --- a/web/app/Style.js +++ b/web/app/Style.js @@ -71,7 +71,7 @@ Ext.define('Traccar.Style', { mapGeofenceTextColor: 'rgba(14, 88, 141, 1.0)', mapGeofenceColor: 'rgba(21, 127, 204, 1.0)', - mapGeofenceOverlay: 'rgba(21, 127, 204, 0.2)', + mapGeofenceOverlayOpacity: 0.2, mapGeofenceWidth: 5, mapGeofenceRadius: 9, diff --git a/web/app/view/GeofenceDialog.js b/web/app/view/GeofenceDialog.js index 7b2112b3..f55a8b2e 100644 --- a/web/app/view/GeofenceDialog.js +++ b/web/app/view/GeofenceDialog.js @@ -16,7 +16,7 @@ */ Ext.define('Traccar.view.GeofenceDialog', { - extend: 'Traccar.view.BaseDialog', + extend: 'Traccar.view.BaseEditDialog', requires: [ 'Traccar.view.GeofenceDialogController' @@ -56,6 +56,9 @@ Ext.define('Traccar.view.GeofenceDialog', { glyph: 'xf21d@FontAwesome', handler: 'onAreaClick' }, { + text: Strings.sharedAttributes, + handler: 'showAttributesView' + }, { xtype: 'tbfill' }, { glyph: 'xf00c@FontAwesome', diff --git a/web/app/view/GeofenceMap.js b/web/app/view/GeofenceMap.js index ad21f70d..0a56b337 100644 --- a/web/app/view/GeofenceMap.js +++ b/web/app/view/GeofenceMap.js @@ -59,7 +59,7 @@ Ext.define('Traccar.view.GeofenceMap', { }, initMap: function () { - var map, featureOverlay, geometry; + var map, featureOverlay, geometry, fillColor; this.callParent(); map = this.map; @@ -74,13 +74,15 @@ Ext.define('Traccar.view.GeofenceMap', { this.mapView.setCenter(geometry.getCoordinates()[0][0]); } } + fillColor = ol.color.asArray(Traccar.Style.mapGeofenceColor); + fillColor[3] = Traccar.Style.mapGeofenceOverlayOpacity; featureOverlay = new ol.layer.Vector({ source: new ol.source.Vector({ features: this.features }), style: new ol.style.Style({ fill: new ol.style.Fill({ - color: Traccar.Style.mapGeofenceOverlay + color: fillColor }), stroke: new ol.style.Stroke({ color: Traccar.Style.mapGeofenceColor, diff --git a/web/app/view/MapController.js b/web/app/view/MapController.js index b8e2657d..99295246 100644 --- a/web/app/view/MapController.js +++ b/web/app/view/MapController.js @@ -86,13 +86,22 @@ Ext.define('Traccar.view.MapController', { this.fireEvent('togglestate', state); }, - getGeofenceStyle: function (label) { + getGeofenceStyle: function (label, color) { + var fillColor, strokeColor; + if (color) { + fillColor = ol.color.asArray(color); + strokeColor = color; + } else { + fillColor = ol.color.asArray(Traccar.Style.mapGeofenceColor); + strokeColor = Traccar.Style.mapGeofenceColor; + } + fillColor[3] = Traccar.Style.mapGeofenceOverlayOpacity; return new ol.style.Style({ fill: new ol.style.Fill({ - color: Traccar.Style.mapGeofenceOverlay + color: fillColor }), stroke: new ol.style.Stroke({ - color: Traccar.Style.mapGeofenceColor, + color: strokeColor, width: Traccar.Style.mapGeofenceWidth }), text: new ol.style.Text({ @@ -114,7 +123,8 @@ Ext.define('Traccar.view.MapController', { Ext.getStore('Geofences').each(function (geofence) { var feature = new ol.Feature(Traccar.GeofenceConverter .wktToGeometry(this.getView().getMapView(), geofence.get('area'))); - feature.setStyle(this.getGeofenceStyle(geofence.get('name'))); + feature.setStyle(this.getGeofenceStyle(geofence.get('name'), + geofence.get('attributes') !== undefined ? geofence.get('attributes').color : undefined)); this.getView().getGeofencesSource().addFeature(feature); return true; }, this); |