Problems implementing groupedLayerControl plugin in R Leaflet - r

Question

I'm trying to implement the plugin extension , groupedLayerControl, for leaflet maps. You can see below the code I'm working with (currently not working). I'm trying to put the overlayers in different group categories. I'm new to javascript so I really can't identify what I'm doing wrong. The code does not give me the groups' layers in the map. Can someone help me out?
registerPlugin <- function(map, plugin) {
map$dependencies <- c(map$dependencies, list(plugin))
map
}
Value1 = c(12,43,54,34,23,77,44,22)
Value2 = c(6,5,2,7,5,6,4,3)
Lat = c(51.1, 51.6, 57.3, 52.4, 56.3, 54.3, 60.4, 49.2)
Lon = c(5, -3, -2, -1, 4, 3, -5, 0)
leaflet() %>%
addProviderTiles(providers$CartoDB.Positron, group = "Alpha") %>%
registerPlugin(groupedLayerControlPlugin) %>%
onRender("function(el, x) {
var baseLayers = {
'Alpha': this.layerManager.getLayerGroup('Alpha'),
};
var groupedOverlays = {
'Group 1': {
'Value1': this.layerManager.getLayerGroup('Value1'),
},
'Group 2': {
'Value2': this.layerManager.getLayerGroup('Value2'),
}
};
var Options = {
groupCheckboxes: true
};
console.log(L.control.groupedLayers);
L.control.groupedLayers(baseLayers, groupedOverlays, Options).addTo(this);
}") %>%
addCircles(lat=Lat, lng=Lon,
radius = Value1*1000, group = "Value1") %>%
addCircles(lat=Lat, lng=Lon,
radius = Value2*10000, group = "Value1")

Answer 1

This is an old question , but thought I'd add a complete working example using your data. You only had one issue in the provided example, which was that you needed at least one group = "Value2" argument for one of the leaflet::addCircles(). Both of the addCircles() in your example show group = "Value1").
In the below code, I've also added an additional base layer to demonstrate base layer grouping in addition to the groupedlayercontrol of overlays.
library(dplyr)
library(leaflet)
library(htmlwidgets)
Value1 = c(12,43,54,34,23,77,44,22)
Value2 = c(6,5,2,7,5,6,4,3)
Lat = c(51.1, 51.6, 57.3, 52.4, 56.3, 54.3, 60.4, 49.2)
Lon = c(5, -3, -2, -1, 4, 3, -5, 0)
urlf <- 'https://raw.githubusercontent.com/ismyrnow/leaflet-groupedlayercontrol/gh-pages/dist/%s'
download.file(sprintf(urlf,'leaflet.groupedlayercontrol.min.js'), 'C:/Temp/L.Control.groupedlayer.js', mode="wb")
download.file(sprintf(urlf,'leaflet.groupedlayercontrol.min.css'), 'C:/Temp/L.Control.groupedlayer.css', mode="wb")
groupedLayerControlPlugin <- htmltools::htmlDependency(
name = 'ctrlGrouped',
version = "1.0.0",
src = c(file = normalizePath('C:/Temp')),
script = "L.Control.groupedlayer.js",
stylesheet = "L.Control.groupedlayer.css"
)
registerPlugin <- function(map, plugin) {
map$dependencies <- c(map$dependencies, list(plugin))
map
}
leaflet() %>%
addProviderTiles("Stamen.Watercolor", group = "Beta") %>%
addProviderTiles(providers$CartoDB.Positron, group = "Alpha") %>%
registerPlugin(groupedLayerControlPlugin) %>%
onRender("function(el, x) {
var groups = {
Value1: this.layerManager.getLayerGroup('Value1'),
Value2: this.layerManager.getLayerGroup('Value2')
};
var baseLayers = {
'Alpha': this.layerManager.getLayerGroup('Alpha'),
'Beta': this.layerManager.getLayerGroup('Beta')
};
var groupedOverlays = {
'all value groups': {
'Value 1' : groups.Value1,
'Value 2' : groups.Value2}
};
var Options = {
groupCheckboxes: true
};
console.log(L.control.groupedLayers);
L.control.groupedLayers(baseLayers, groupedOverlays, Options).addTo(this);
}") %>% addCircles(lat=Lat, lng=Lon,
radius = Value1*1000, group = "Value1") %>%
addCircles(lat=Lat, lng=Lon,
radius = Value2*10000, group = "Value2")