dataTables.rowsGroup.js合并列时顺序反转如何恢复正常？

问题表现 #

使用dataTables.rowsGroup.js合并DT表格第一列单元格时，合并功能生效，但列顶部优先显示Population 6，不符合预期的Population 1排在首位的顺序。

问题原因 #

• DT组件初始化默认开启自动排序，未显式指定排序规则时会打乱原始数据的行顺序
• 2.0.0版本的dataTables.rowsGroup.js默认从表格底部向上遍历做合并逻辑，取每组最后一行的内容作为合并单元格的显示值，行序错乱后就会出现靠后的Population 6显示在顶部的问题

原始复现代码 #

library(DT)
Population<-c("Population 1","Population 1","Population 1","Population 2","Population 2","Population 2","Population 3","Population 3",
                "Population 4","Population 4","Population 5","Population 5","Population 5","Population 6","Population 6","Population 6")
Variable<-c("row 1","row 2 to 10","total","row 1","row 2 to 10","total","row 1","total","row 1","total","row 1","row 2 to 5","total","row 1","row 2 to 5","total")
df<-data.frame(Population,Variable)
df$Population <- factor(df$Population, levels = c("Population 1","Population 2","Population 3","Population 4","Population 5","Population 6"))

dtable <- datatable(df, rownames = FALSE,
                    options = list(
                      rowsGroup = list(0) # 合并第一列单元格
                    ))
path <- "C:/Users/User/Documents/Darya/www"
dep <- htmltools::htmlDependency(
  "RowsGroup", "2.0.0",
  path, script = "dataTables.rowsGroup.js")
dtable$dependencies <- c(dtable$dependencies, list(dep))
dtable

修复方案 #

根据是否需要保留表格排序功能二选一即可，其余依赖加载代码无需改动：

• 不需要排序功能：关闭自动排序锁定原始行序，同时指定rowsGroup从顶部向下遍历合并

  dtable <- datatable(df, rownames = FALSE,
                      options = list(
                        ordering = FALSE, # 关闭自动排序，完全保留原始数据行顺序
                        rowsGroup = list(
                          0,
                          direction = "forward" # 从首行开始向下遍历合并，取每组首行内容显示
                        )
                      ))
  

• 需要保留排序功能：显式指定初始排序规则为第一列升序，匹配预设的Population因子顺序

  dtable <- datatable(df, rownames = FALSE,
                      options = list(
                        order = list(list(0, "asc")), # 初始按第一列升序排列
                        rowsGroup = list(
                          0,
                          direction = "forward"
                        )
                      ))
  

修改后运行即可恢复Population 1到Population 6的正常显示顺序。

内容的提问来源于stack exchange，提问作者firmo23