[TASK] Configuable zoom for label and client layers

README.md

@@ -108,6 +108,14 @@ Lost will be splitted in alert and lost.
 Max level to be applied by clicking a node or open a node. With value `18` near by buildings and streets should be visible.
 Interesting if one of configured map provider has zoom-level under `18`.
 
+## labelZoom (integer)
+
+Min. level for node labels shown on the map. Labels aren't shown in first zoom levels and need performance.
+
+## clientZoom (integer)
+
+Min. level to set starting layer for client dots on map.
+
 ## nodeInfobox
 
 #### contact (bool)

config.json

@@ -30,6 +30,8 @@
   "maxAge": 14,
   "maxAgeAlert": 3,
   "nodeZoom": 18,
+  "labelZoom": 13,
+  "clientZoom": 15,
   "nodeInfobox": {
     "contact": false,
     "hardwareUsage": true

lib/map.js

@@ -297,11 +297,11 @@ define(['map/clientlayer', 'map/labelslayer',
       layerControl = L.control.layers(baseLayers, [], { position: 'bottomright' });
       layerControl.addTo(map);
 
-      var clientLayer = new ClientLayer({ minZoom: 15 });
+      var clientLayer = new ClientLayer({ minZoom: config.clientZoom });
       clientLayer.addTo(map);
       clientLayer.setZIndex(5);
 
-      var labelsLayer = new LabelsLayer({});
+      var labelsLayer = new LabelsLayer({ minZoom: config.labelZoom });
       labelsLayer.addTo(map);
       labelsLayer.setZIndex(6);
 

lib/map/labelslayer.js

@@ -29,7 +29,7 @@ define(['leaflet', 'rbush', 'helper'],
       return o;
     }
 
-    function prepareLabel(fillStyle, fontSize, offset, stroke, minZoom) {
+    function prepareLabel(fillStyle, fontSize, offset, stroke) {
       return function (d) {
         var font = fontSize + 'px ' + bodyStyle.fontFamily;
         return {
@@ -40,7 +40,6 @@ define(['leaflet', 'rbush', 'helper'],
           height: fontSize * 1.2,
           font: font,
           stroke: stroke,
-          minZoom: minZoom,
           width: measureText(font, d.nodeinfo.hostname).width
         };
       };
@@ -102,10 +101,10 @@ define(['leaflet', 'rbush', 'helper'],
         // - label (string)
         // - color (string)
 
-        var labelsOnline = d.online.map(prepareLabel(bodyStyle.color, 11, 8, true, 13));
-        var labelsOffline = d.offline.map(prepareLabel('rgba(212, 62, 42, 0.9)', 9, 5, false, 16));
-        var labelsNew = d.new.map(prepareLabel('rgba(48, 99, 20, 0.9)', 11, 8, true, 0));
-        var labelsLost = d.lost.map(prepareLabel('rgba(212, 62, 42, 0.9)', 11, 8, true, 0));
+        var labelsOnline = d.online.map(prepareLabel(bodyStyle.color, 11, 8, true));
+        var labelsOffline = d.offline.map(prepareLabel('rgba(212, 62, 42, 0.9)', 9, 5, false));
+        var labelsNew = d.new.map(prepareLabel('rgba(48, 99, 20, 0.9)', 11, 8, true));
+        var labelsLost = d.lost.map(prepareLabel('rgba(212, 62, 42, 0.9)', 11, 8, true));
         labelShadow = bodyStyle.backgroundColor.replace(/rgb/i, 'rgba').replace(/\)/i, ',0.7)');
 
         var labels = []
@@ -138,7 +137,7 @@ define(['leaflet', 'rbush', 'helper'],
             var offset = calcOffset(n.offset, loc);
             var i;
 
-            for (i = maxZoom; i >= n.minZoom; i--) {
+            for (i = maxZoom; i >= minZoom; i--) {
               var p = map.project(n.position, i);
               var rect = labelRect(p, offset, loc, n, minZoom, maxZoom, i);
               var candidates = trees[i].search(rect);
@@ -187,7 +186,7 @@ define(['leaflet', 'rbush', 'helper'],
         this.redraw();
       },
       drawTile: function (canvas, tilePoint, zoom) {
-        if (!this.labels) {
+        if (!this.labels && zoom >= this.options.minZoom) {
           return;
         }