aboutsummaryrefslogtreecommitdiff
path: root/web/simple
diff options
context:
space:
mode:
Diffstat (limited to 'web/simple')
-rw-r--r--web/simple/app.js37
1 files changed, 35 insertions, 2 deletions
diff --git a/web/simple/app.js b/web/simple/app.js
index 1a5fabf..19c4de5 100644
--- a/web/simple/app.js
+++ b/web/simple/app.js
@@ -17,10 +17,30 @@
var url = 'http://localhost:8082';
var token = 'TOKEN';
+var style = new ol.style.Style({
+ image: new ol.style.Circle({
+ fill: new ol.style.Fill({
+ color: 'teal'
+ }),
+ stroke: new ol.style.Stroke({
+ color: 'navy',
+ width: 2
+ }),
+ radius: 7
+ })
+});
+
+var source = new ol.source.Vector();
+
+var markers = {};
+
var map = new ol.Map({
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
+ }),
+ new ol.layer.Vector({
+ source: source
})
],
target: 'map',
@@ -55,8 +75,21 @@ ajax('GET', url + '/api/session?token=' + token, function(user) {
socket.onmessage = function (event) {
var data = JSON.parse(event.data);
-
- console.log(data);
+ if (data.positions) {
+ for (i = 0; i < data.positions.length; i++) {
+ var position = data.positions[i];
+ var marker = markers[position.deviceId];
+ var point = new ol.geom.Point(ol.proj.fromLonLat([position.longitude, position.latitude]));
+ if (!marker) {
+ marker = new ol.Feature(point);
+ marker.setStyle(style);
+ markers[position.deviceId] = marker;
+ source.addFeature(marker);
+ } else {
+ marker.setGeometry(point);
+ }
+ }
+ }
};
});