diff options
author | Anton Tananaev <anton.tananaev@gmail.com> | 2015-10-20 22:26:54 +1300 |
---|---|---|
committer | Anton Tananaev <anton.tananaev@gmail.com> | 2015-10-20 22:26:54 +1300 |
commit | 28bdf02cc3e80d62a1fe49243e11d8ee3e9b0448 (patch) | |
tree | aa7deb69c6aea7f640698f53a2867efec16660e2 /web/app/view/MapController.js | |
parent | 42c16920b42938c2e9e978b34f0ef015b6b22a7a (diff) | |
download | traccar-server-28bdf02cc3e80d62a1fe49243e11d8ee3e9b0448.tar.gz traccar-server-28bdf02cc3e80d62a1fe49243e11d8ee3e9b0448.tar.bz2 traccar-server-28bdf02cc3e80d62a1fe49243e11d8ee3e9b0448.zip |
Put experimental label on map
Diffstat (limited to 'web/app/view/MapController.js')
-rw-r--r-- | web/app/view/MapController.js | 23 |
1 files changed, 20 insertions, 3 deletions
diff --git a/web/app/view/MapController.js b/web/app/view/MapController.js index 0b5e60175..6e875fe3b 100644 --- a/web/app/view/MapController.js +++ b/web/app/view/MapController.js @@ -50,6 +50,7 @@ Ext.define('Traccar.view.MapController', { for (i = 0; i < data.length; i++) { var store = Ext.getStore('LatestPositions'); + var deviceStore = Ext.getStore('Devices'); var found = store.query('deviceId', data[i].deviceId); if (found.getCount() > 0) { @@ -66,7 +67,9 @@ Ext.define('Traccar.view.MapController', { if (data[i].deviceId in this.liveData) { this.liveData[data[i].deviceId].setGeometry(geometry); } else { - var style = this.getMarkerStyle(Traccar.Style.mapLiveRadius, Traccar.Style.mapLiveColor); + var name = deviceStore.query('id', data[i].deviceId).first().get('name'); + + var style = this.getMarkerStyle(Traccar.Style.mapLiveRadius, Traccar.Style.mapLiveColor, name); var marker = new ol.Feature({ geometry: geometry, originalStyle: style @@ -94,7 +97,7 @@ Ext.define('Traccar.view.MapController', { }); }, - getMarkerStyle: function (radius, color) { + getMarkerStyle: function (radius, color, text) { return new ol.style.Style({ image: new ol.style.Circle({ radius: radius, @@ -105,6 +108,19 @@ Ext.define('Traccar.view.MapController', { color: Traccar.Style.mapStrokeColor, width: Traccar.Style.mapMarkerStroke }) + }), + text: new ol.style.Text({ + textBaseline: 'bottom', + text: text, + fill: new ol.style.Fill({ + color: '#000' + }), + stroke: new ol.style.Stroke({ + color: '#FFF', + width: 2 + }), + offsetY: -12, + font : 'bold 12px sans-serif' }) }); }, @@ -173,7 +189,8 @@ Ext.define('Traccar.view.MapController', { } if (feature !== undefined) { - feature.setStyle(this.getMarkerStyle(Traccar.Style.mapSelectRadius, Traccar.Style.mapSelectColor)); + var name = feature.getStyle().getText().getText(); + feature.setStyle(this.getMarkerStyle(Traccar.Style.mapSelectRadius, Traccar.Style.mapSelectColor, name)); var pan = ol.animation.pan({ duration: Traccar.Style.mapDelay, |