stash..

R/layergroupcollision.R

@@ -13,6 +13,7 @@ layergroupCollisionDependency <- function() {
 }
 
 #' Add LayerroupCollision Plugin
+#' Needs data to be ordered, as frst elements will have priority.
 #' @return A leaflet map object
 #' @export
 #'
@@ -25,8 +26,8 @@ addLayerGroupCollision <- function(
     popup = NULL, popupOptions = NULL, label = NULL,
     labelOptions = NULL,
     className = NULL, html = NULL,
-    options = markerOptions(), clusterOptions = NULL,
-    clusterId = NULL, margin = 5, data = getMapData(map)
+    options = markerOptions(),
+    margin = 5, data = getMapData(map)
 ) {
 
   map$dependencies <- c(map$dependencies, layergroupCollisionDependency())
@@ -49,9 +50,7 @@ addLayerGroupCollision <- function(
     className, html,
     popup, popupOptions,
     label, labelOptions,
-    clusterId, clusterOptions,
     margin
-    # getCrosstalkOptions(data)
   ) %>%
     expandLimits(pts$lat, pts$lng)
 }

inst/examples/layergroupcollision_app.R

@@ -14,9 +14,12 @@ df <- sf::st_as_sf(atlStorms2005)
 df <- suppressWarnings(st_cast(df, "POINT"))
 df <- df[sample(1:nrow(df), 150, replace = F),]
 # df$classes = sample(x = c("myclass1","myclass2","myclass3"), nrow(df), replace = TRUE)
-df$classes = sample(x = 1:5, nrow(df), replace = TRUE)
+df$classes = sample(x = 1:10, nrow(df), replace = TRUE)
 df$ID <- paste0("ID_", 1:nrow(df))
-df$scalerank <-  sample(x = 1:5, nrow(df), replace = TRUE)
+df$scalerank <-  sample(x = 1:10, nrow(df), replace = TRUE)
+
+## Ordering is important
+df <- df[order(df$scalerank, decreasing = FALSE),]
 
 ui <- fluidPage(
   ## CSS-style ############
@@ -29,10 +32,10 @@ ui <- fluidPage(
 			white-space: nowrap;
 		}
 
-		.city-label-0 { font-size: 20px; top: -27px; }
-		.city-label-1 { font-size: 19px; top: -26px; }
-		.city-label-2 { font-size: 18px; top: -25px; }
-		.city-label-3 { font-size: 17px; top: -24px; }
+		.city-label-0 { font-size: 30px; top: -27px; }
+		.city-label-1 { font-size: 25px; top: -26px; }
+		.city-label-2 { font-size: 24px; top: -25px; }
+		.city-label-3 { font-size: 22px; top: -24px; }
 		.city-label-4 { font-size: 16px; top: -23px; }
 		.city-label-5 { font-size: 15px; top: -22px; }
 		.city-label-6 { font-size: 14px; top: -21px; }
@@ -45,6 +48,7 @@ ui <- fluidPage(
   leafletOutput("map", height = 800)
 )
 
+## Server ###########
 server <- function(input, output, session) {
   output$map <- renderLeaflet({
     leaflet() %>%

inst/htmlwidgets/lfx-layergroupcollision/layergroup-binding.js

@@ -1,13 +1,11 @@
 /* global LeafletWidget, $, L, Shiny, HTMLWidgets */
 LeafletWidget.methods.addLayerGroupCollision = function(
     data, layerId, group, options,
-    className, html,
-    popup, popupOptions, label, labelOptions,
-    clusterId, clusterOptions, divOptions,
-    crosstalkOptions) {
+    className, html, popup, popupOptions,
+    label, labelOptions, margin) {
 
 
-		var collisionLayer = L.LayerGroup.collision({margin:5});
+		var collisionLayer = L.LayerGroup.collision({margin: margin});
 		console.log("collisionLayer"); console.log(collisionLayer)
 
 		// Manually parse the GeoJSON and create the L.Markers one by one
@@ -16,15 +14,15 @@ LeafletWidget.methods.addLayerGroupCollision = function(
 		for (var i=0; i < data.features.length; i++) {
 
 			var feat = data.features[i];
-			var labelClass = 'city-label city-label-' + feat.properties.scalerank;
+			var labelClass = 'city-label city-label-' + feat.properties.strklasse_numeric;
 
 // 			Note that the markers are not interactive because MSIE on a WinPhone will take *ages*
 // 			to run addEventListener() on them.
 			var marker = L.marker(L.GeoJSON.coordsToLatLng(feat.geometry.coordinates), {
 				icon: L.divIcon({
 					html:
 						"<span class='" + labelClass + "'>" +
-						feat.properties.Name +
+						feat.properties.strnummer +
 						"</span>"
 				})
 				,interactive: false	// Post-0.7.3