Search code examples
rreactable

Is it possible to create double column names in reactable library?


I found here examples, of how to do tables with reachable function, however, did not find (also in different sources) how to do double-column names

library(reachable)
library(data.table) 

data<-structure(list(date = structure(c(1580428800, 1582848000, 1585612800, 
1588204800, 1580428800, 1582848000, 1585612800, 1588204800, 1580428800, 
1582848000, 1585612800, 1588204800, 1580428800, 1582848000, 1585612800, 
1588204800, 1580428800, 1582848000, 1585612800, 1588204800, 1580428800, 
1582848000, 1585612800, 1588204800, 1580428800, 1582848000, 1585612800, 
1588204800, 1580428800, 1582848000, 1585612800, 1588204800, 1588204800
), class = c("POSIXct", "POSIXt"), tzone = "UTC"), group = c("a", 
"a", "a", "a", "a", "a", "a", "a", "b", "b", "b", "b", "b", "b", 
"b", "b", "c", "c", "c", "c", "c", "c", "c", "c", "d", "d", "d", 
"d", "d", "d", "d", "d", "e"), value = c(54.3923333333333, 52.278, 
43.5828333333333, 41.39875, 54.9545, 53.12025, 46.044, 44.4135, 
-14.8910166666667, -12.3993916666667, -9.64581666666667, -9.449925, 
-13.4157916666667, -11.1878416666667, -9.567625, -9.47255833333334, 
92, 66, 42, 63.75, 81, 55, 31, 59.375, 916.175525, 739.877458333333, 
533.883366666667, 658.222004166667, 955.311075, 752.5635875, 
531.2294, 722.806975, 722.806975), multiplication_factor = c(1, 
2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 33, 34, 35, 36, 37, 
38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 51)), row.names = c(NA, 
-33L), class = c("data.table", "data.frame"), .internal.selfref = <pointer: 0x0000012c2e1a1ef0>)


data<-dcast(setDT(data), group ~ date, value.var=c("value", "multiplication_factor"))
reactable(data)

Using this code reachable() creates a table, however, date and value/multiplication_factor are joined together to show column names. I want make the first row/layer of the column name to show date and the second to show the variable (value/multiplication_factor)

Is it possible to do something similar to this table using the same function?

enter image description here


Solution

  • This could be achieved via Column Groups. Following the example in the reactable docs and making use of lapply:

    library(reactable)
    library(data.table)
    
    data_wide <- dcast(setDT(data), group ~ date, value.var = c("value", "multiplication_factor"))
    
    cols <- names(data_wide)[!names(data_wide) %in% c("group")]
    cols <- setNames(cols, cols)
    
    col_groups <- as.character(unique(data$date))
    
    columns <- lapply(cols, function(x) colDef(name = if (grepl("^value", x)) "value" else "multiplication_factor"))
    columnGroups <- lapply(col_groups, function(x) {
      cols <- unlist(cols[grepl(x, names(cols))])
      colGroup(name = x, columns = unname(cols))
    })
    
    reactable(
      data_wide,
      columns = columns,
      columnGroups = columnGroups
    )