colour_range for grid, but errors for screengrid

R/map_layer_grid.R

@@ -19,6 +19,7 @@ mapdeckGridDependency <- function() {
 #' @inheritParams add_arc
 #' @param lon column containing longitude values
 #' @param lat column containing latitude values
+#' @param colour_range vector of hex colours
 #' @param cell_size size of each cell in meters
 #' @param extruded logical indicating if cells are elevated or not
 #' @param elevation_scale cell elevation multiplier
@@ -27,6 +28,8 @@ mapdeckGridDependency <- function() {
 #' \dontrun{
 #' df <- read.csv('https://raw.githubusercontent.com/uber-common/deck.gl-data/master/examples/3d-heatmap/heatmap-data.csv')
 #'
+#' key <- read.dcf("~/Documents/.googleAPI", fields = "MAPBOX")
+#'
 #' mapdeck( token = key, style = 'mapbox://styles/mapbox/dark-v9', pitch = 45 ) %>%
 #' add_grid(
 #'   data = df
@@ -45,12 +48,12 @@ add_grid <- function(
 	lon = NULL,
 	lat = NULL,
 	polyline = NULL,
+	colour_range = viridisLite::viridis(5),
 	cell_size = 1000,
 	extruded = TRUE,
 	elevation_scale = 1,
 	layer_id,
-	digits = 6,
-	palette = viridisLite::viridis
+	digits = 6
 ) {
 
 	objArgs <- match.call(expand.dots = F)
@@ -107,7 +110,7 @@ add_grid <- function(
 	shape <- jsonlite::toJSON(shape, digits = digits)
 
 	map <- addDependency(map, mapdeckGridDependency())
-	invoke_method(map, "add_grid", shape, layer_id, cell_size, jsonlite::toJSON(extruded, auto_unbox = T), elevation_scale)
+	invoke_method(map, "add_grid", shape, layer_id, cell_size, jsonlite::toJSON(extruded, auto_unbox = T), elevation_scale, colour_range)
 }
 
 

R/map_layer_screengrid.R

@@ -85,7 +85,7 @@ add_screengrid <- function(
 	shape <- jsonlite::toJSON(shape, digits = digits)
 
 	map <- addDependency(map, mapdeckScreengridDependency())
-	invoke_method(map, "add_screengrid", shape, layer_id )
+	invoke_method(map, "add_screengrid", shape, layer_id, colour_range )
 }
 
 

inst/htmlwidgets/lib/grid/grid.js

@@ -1,18 +1,16 @@
 
-function add_grid( map_id, grid_data, layer_id, cell_size, extruded, elevation_scale ) {
-
-  //console.log( grid_data );
+function add_grid( map_id, grid_data, layer_id, cell_size, extruded, elevation_scale, colour_range ) {
 
   const gridLayer = new deck.GridLayer({
     id: 'grid-'+layer_id,  // TODO
     data: grid_data,
     pickable: true,
     extruded: extruded,
     cellSize: cell_size,
+    colorRange: to_rgba( colour_range ),
     elevationScale: elevation_scale,
     getPosition: d => decode_polyline( d.polyline )[0],
     onClick: info => layer_click( map_id, "grid", info )
   });
-
 	update_layer( map_id, 'arc-'+layer_id, gridLayer );
 }

inst/htmlwidgets/lib/screengrid/screengrid.js

@@ -1,12 +1,10 @@
 
 function add_screengrid( map_id, screengrid_data, layer_id ) {
-
-  console.log( screengrid_data );
-
 	const screengridLayer = new deck.ScreenGridLayer({
 		id: 'screengrid-'+layer_id,  // TODO
 		data: screengrid_data,
 		cellSizePixels: 50,
+		//colorRange: to_rgba( colour_range ),
     getPosition: d => [d.lon, d.lat],
     getWeight: d => d.weight,
     onClick: info => layer_click( map_id, "screengrid", info )

inst/htmlwidgets/mapdeck.js

@@ -156,6 +156,21 @@ const hexToRgb = hex =>
     .substring(1).match(/.{2}/g)
     .map(x => parseInt(x, 16));
 
+/**
+ * Converts a 'vector' of hex colours (with alpha) into an array
+ */
+function to_rgba( colour_range ) {
+	var arr = [],
+	i,
+	n = colour_range.length;
+
+	for (i = 0; i < n; i++) {
+		arr.push( hexToRgb(colour_range[i]) );
+	}
+  console.log( arr );
+  return arr;
+}
+
 function layer_click( map_id, layer, info ) {
 
   if ( !HTMLWidgets.shinyMode ) {