add label argument to all methods, update docs and update news

NEWS.md

@@ -1,5 +1,9 @@
 ## leafgl 0.2.1
 
+new features:
+
+  * all methods can now have labels/tooltips. Currently only lines and polygons support passing of a column name, points need a predefined label vector.
+
 miscallaneous:
 
   * all methods now have a pane argument to control layer ordering (thanks to @trafficonese). #67 #64

R/glify-lines.R

@@ -28,6 +28,7 @@ addGlPolylines = function(map,
                           opacity = 0.6,
                           group = "glpolylines",
                           popup = NULL,
+                          label = NULL,
                           weight = 1,
                           layerId = NULL,
                           src = FALSE,
@@ -130,6 +131,7 @@ addGlPolylines = function(map,
     , data
     , cols
     , popup
+    , label
     , opacity
     , group
     , weight

R/glify-points.R

@@ -17,8 +17,10 @@
 #' @param radius point size in pixels.
 #' @param group a group name for the feature layer.
 #' @param popup Object representing the popup. Can be of type character with column names,
-#'   formula, logical, data.frame or matrix, Spatial, list or JSON. If the lenght does not
+#'   formula, logical, data.frame or matrix, Spatial, list or JSON. If the length does not
 #'   match the number of rows in the dataset, the popup vector is repeated to match the dimension.
+#' @param label either a column name (currently only supported for polygons and polylines)
+#'   or a character vector to be used as label.
 #' @param layerId the layer id
 #' @param weight line width/thicknes in pixels for \code{addGlPolylines}.
 #' @param src whether to pass data to the widget via file attachments.
@@ -61,6 +63,7 @@ addGlPoints = function(map,
                        radius = 10,
                        group = "glpoints",
                        popup = NULL,
+                       label = NULL,
                        layerId = NULL,
                        src = FALSE,
                        pane = "overlayPane",
@@ -155,6 +158,7 @@ addGlPoints = function(map,
     , data
     , fillColor
     , popup
+    , label
     , fillOpacity
     , radius
     , group

inst/htmlwidgets/Leaflet.glify/addGlifyPoints.js

@@ -1,4 +1,4 @@
-LeafletWidget.methods.addGlifyPoints = function(data, cols, popup, opacity, radius, group, layerId, dotOptions, pane) {
+LeafletWidget.methods.addGlifyPoints = function(data, cols, popup, label, opacity, radius, group, layerId, dotOptions, pane) {
 
   const map = this;
 
@@ -42,10 +42,31 @@ LeafletWidget.methods.addGlifyPoints = function(data, cols, popup, opacity, radi
       }
     };
 
+  let tooltip = new L.Tooltip();
+
+  var hover_event = function(e, point, addlabel, label) {
+    var idx = data.findIndex(k => k==point);
+      //set up a standalone label (use a label as a layer)
+      if (map.hasLayer(pointslayer.layer)) {
+        var content = label ? label[idx].toString() : null;
+        if (label !== null) {
+          tooltip
+            .setLatLng(point)
+            .setContent(content)
+            .addTo(map);
+        }
+      }
+  }
+
+  var hvr = function(e, feature) {
+    hover_event(e, feature, label !== null, label);
+  }
+
   // arguments for gl layer
   var pointsArgs = {
     map: map,
     click: clickFun,
+    hover: hvr,
     data: data,
     color: clrs,
     opacity: opacity,

inst/htmlwidgets/Leaflet.glify/addGlifyPolygons.js

@@ -55,6 +55,7 @@ LeafletWidget.methods.addGlifyPolygons = function(data, cols, popup, label, opac
     hover_event(e, feature, label !== null, label);
   }
 
+
   var shapeslayer = L.glify.shapes({
     map: map,
     click: pop,

inst/htmlwidgets/Leaflet.glify/addGlifyPolylines.js

@@ -1,4 +1,4 @@
-LeafletWidget.methods.addGlifyPolylines = function(data, cols, popup, opacity, group, weight, layerId, pane) {
+LeafletWidget.methods.addGlifyPolylines = function(data, cols, popup, label, opacity, group, weight, layerId, pane) {
 
   var map = this;
 
@@ -43,9 +43,29 @@ LeafletWidget.methods.addGlifyPolylines = function(data, cols, popup, opacity, g
     click_event(e, feature, popup !== null, popup);
   };
 
+  // var label = "testtest";
+  let tooltip = new L.Tooltip();
+
+  var hover_event = function(e, feature, addlabel, label) {
+    if (map.hasLayer(lineslayer.layer)) {
+      if (addlabel) {
+        tooltip
+         .setLatLng(e.latlng)
+         .setContent(feature.properties[[label]].toString())
+         .addTo(map);
+      }
+    }
+  }
+
+  var hvr = function(e, feature) {
+    hover_event(e, feature, label !== null, label);
+  }
+
+
   var lineslayer = L.glify.lines({
     map: map,
     click: pop,
+    hover: hvr,
     latitudeKey: 1,
     longitudeKey: 0,
     data: data,