R Использование JavaScript для настройки таблиц DT

Question

Ранее я спрашивал, как покрасить ячейки на основе цветов, хранящихся в скрытых столбцах ( ссылка ) и как получить информацию при наведении на ячейку ( ссылка ). Я также хотел бы выполнить некоторое форматирование одновременно.

Я хочу расширить свои начальные сообщения, где я хочу

1. добавить цвет в зависимости от цвета, указанного во фрейме данных
2. добавить параметр наведения, чтобы отобразить размеры выборки, относящиеся к отдельным ячейкам (также во фрейме данных).
3. применить форматирование чисел к указанным столбцам

Пример данных:

dat <- iris[1:5,1:5]
colours2apply <- sample(x=c(rgb(1, 0, 0 ), rgb(1, 1, 0 ), rgb(0, 1, 1 )), 25, replace = T) %>% 
  matrix(nrow=5) %>% 
  data.frame()
set.seed(1234)
SampleSizesToShowInHover <- matrix(round(runif(n = 25, 10, 1000)), nrow=5)

  dat <- cbind(dat, colours2apply)
  dat <- cbind(dat, SampleSizesToShowInHover)
dat

Окончательное решение для выполнения 1 и 2 одновременно:

library(DT)
solution12 <- DT::datatable(dat, 
                options = 
                  list(
                    columnDefs = list(
                      list(
                        visible=FALSE, 
                        targets = 6:15
                      )
                    ), 
                    rowCallback = JS(
                      "function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {",
                      'for(i=0; i<5; i++ ){',
                      "var full_text = 'n = '+ aData[i+10];",
                      "$('td:eq('+i+')', nRow).attr('title', full_text).css('background-color', aData[i+5]);",
                      '}',
                      "}")


                  )
)
solution12

Как интегрировать JavaScript для представления данных в столбцах 3 и 4 в процентахс 1 десятичным знаком при сохранении решений до 1 и 2?

Любая помощь высоко ценится! С уважением, Люк

Answer 1

Чтобы изменить число в процентах, мы могли бы просто умножить число на 100. Чтобы округлить его до 1 десятичного знака, мы можем использовать функцию js toFixed(1), а затем мы можем просто добавить знак процента, используя + %. Чтобы сохранить исходное форматирование и добавить новые изменения, это будет выглядеть следующим образом: "$('td:eq('+i+')', nRow).attr('title', full_text).css('background-color', aData[i+5]).html((aData[i]*100).toFixed(1)+ '%');",

Изменение кода для простого добавления этого в столбцы 3 и 4 будет следующим:

  DT::datatable(dat, 
                            options = 
                              list(
                                columnDefs = list(
                                  list(
                                    visible=FALSE, 
                                    targets = 6:15
                                  )
                                ), 
                                rowCallback = JS(
                                  "function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {",
                                  'for(i=0; i<5; i++ ){',
                                  "var full_text = 'n = '+ aData[i+10];",
                                 "if(i === 3 || i=== 4) {",
                                 "$('td:eq('+i+')', nRow).attr('title', full_text).css('background-color', aData[i+5]).html((aData[i]*100).toFixed(1)+ '%');",
                                 "}",
                                 "else{",
                                 "$('td:eq('+i+')', nRow).attr('title', full_text).css('background-color', aData[i+5]);",
                                 "}",
                                  '}',
                                  "}")
                              )
)

С этим изменением вы получите:

Надеюсь, это поможет!