Revize 61ff7718

Re #8092, Re #8085
+ data source points location layer - circles
+ total number of activity in aggregation

website/public/js/zcu-heatmap.js

@@ -1 +1 @@
 var mymap;
 var heatmapLayer = null;
+var marksLayer = null;
 
 var startX = 49.7248;
 var startY = 13.3521;
@@ -46 +47 @@
   var lat = 0;
   var lng = 0;
 
+  var total = 0;
   data[currentTime]['items'].forEach(element => {
     if (e.latlng.distanceTo(new L.LatLng(element.x, element.y)) < radius) {
       lat += element.x
       lng += element.y;
       info[i] = {'place' : element.place, 'number' : element.number};
+      total += parseInt(element.number);
       i++;
     }
   });
@@ -62 +65 @@
                   })
                   .setLatLng([lat / i, lng / i])
                   .setContent('<strong>Zařízení a počet:</strong><div id=\'place-info\'>' + info[currenInfo].place + '</div>' +
-                              '<div id=\'number-info\'>' + info[currenInfo].number + '</div>' +
+                              '<div id=\'number-info\'><span id=\'digit-info\'>' + info[currenInfo].number + '</span>' + '<span id=\'total-info\' style="font-size: large">/' + total +'</span></div>' + 
                               '<div class=\'popup-controls\'>' +
                                 '<button id=\'previous-info-btn\' class=\'circle-button\' onclick=\'previousInfo()\'></button>' +
-                                '<div id=\'count-info\'>' + (currenInfo + 1) + '/' + info.length + '</div>' +
+                                '<div id=\'count-info\'>' + (currenInfo + 1) + ' z ' + info.length + '</div>' +
                                 '<button id=\'next-info-btn\' onclick=\'nextInfo()\' class=\'circle-button next\'></button>' +
                               '</div>'
                               )
@@ -92 +95 @@
 
 function displayInfoText() {
   $('#place-info').html(info[currenInfo].place)
-  $('#number-info').html(info[currenInfo].number)
-  $('#count-info').html(currenInfo + 1 + '/' + info.length);
+  $('#digit-info').html(info[currenInfo].number)
+  $('#count-info').html(currenInfo + 1 + ' z ' + info.length);
 }
 
 function setMapView(latitude = startX, longitude = startY, zoom = startZoom) {
@@ -155 +158 @@
   $('#timeline').attr('class', 'time hour-' + currentTime);
 }
 
-function loadCurrentTimeHeatmap(route) {
+function loadCurrentTimeHeatmap(opendataRoute, positionsRoute) {
 
-  dataSourceRoute = route;
   data = []
 
-  name = $('#type').children("option:selected").text();
+  name = $('#type').children("option:selected").val();
   date = $('#date').val()
   currentTime = parseInt($('#time').children("option:selected").val());
   setTimeline();
 
   $.ajax({
     type: "POST",
-    url: dataSourceRoute + '/' +  name + '/' + date + '/' + currentTime,
+    url: opendataRoute + '/' +  name + '/' + date + '/' + currentTime,
     success: function(result) {
       data[currentTime] = result;
       drawHeatmap(data[currentTime]);
     }
   });
 
+  $.ajax({
+    type: 'POST',
+    url: positionsRoute + '/' + name,
+    success: function(result) {
+      drawDataSourceMarks(result)
+    }
+  });
+
   preload(currentTime, 1);
   preload(currentTime, -1);
 
 }
 
+function drawDataSourceMarks(data) {
+
+  if (marksLayer != null) {
+    L.removeLayer(marksLayer);
+  }
+
+  marksLayer = L.layerGroup();
+  for (var key in data) {
+    marksLayer.addLayer(L.circle([data[key]['x'], data[key]['y']], {radius: 1, color: 'black'}));
+  }
+
+  marksLayer.addTo(mymap);
+
+}
+
 function preload(time, change) {
 
   var ntime = time + change;