Как изменить цвет фиксированных столбцов и отобразить данные POSIXct в DT :: datatable Shiny? - PullRequest
1 голос
/ 06 апреля 2020

Я использую тему superhero в Shiny вместе со строкой ниже, которая помогает сделать цвет текста фильтра черным,

ui <- fluidPage(
    theme = shinytheme("superhero"),
    tags$head(tags$style("div.dataTables_scrollHead span {color: black;}")),
    ...
)

1. Однако фиксированные столбцы (временной столбец 1) цвет не противоречит цвету темы. Это белый и трудно увидеть текст. Как я могу изменить это, чтобы соответствовать цвету темы супергероя или изменить его на более удобный для пользователя цвет?

Обновление: Итак, мне удалось изменить фиксированный цвет столбца, но я хочу один ряд должен быть темно-синим, а другой - голубым. Кроме того, индекс строки и заголовок столбца по-прежнему белого цвета, как показано на рисунке ниже.

output$mytable     <- DT::renderDataTable(datatable(df,rownames = T,
                                                     filter="top", 
                                                      extensions = "FixedColumns",style = 'bootstrap',
                                                      options = list(scrollX = TRUE, scrollY = TRUE,
                                                                     autoWidth = F,
                                                                     columnDefs = list(list(width = '145px', targets = c(1))),
                                                                     fixedColumns=list(leftColumns=2))) 
                                                     %>%formatRound(c(2:l_agg), 2)%>% formatStyle('Timestamp',backgroundColor='#2B3E50'))

enter image description here

Обновленное изображение Updated Image

2. И сейчас фиксированный столбец (время) имеет тип character (приведен от POSIXct к символу), я пытался ввести POSIXct время в datatable, но часовой пояс другой. Как получить столбец времени с типом POSIXct и правильно отформатировать его в datatable?

Например, это данные о временных рядах, которые у меня есть, и в идеале я хочу, чтобы данные Shiny отображались, как показано ниже, без части CST.

[1] "2020-04-06 09:31:20.000 CST" "2020-04-06 09:31:51.000 CST" "2020-04-06 09:32:21.000 CST" "2020-04-06 09:32:50.000 CST"
[5] "2020-04-06 09:33:21.000 CST" "2020-04-06 09:33:51.000 CST"

Структура

structure(c(1586136680.0005, 1586136711.0005, 1586136741.0005, 
1586136770.0005, 1586136801.0005, 1586136831.0005), class = c("POSIXct", 
"POSIXt"), tzone = "")

Однако в Shiny она отображается так, как показано ниже, а это не то, что я хочу. enter image description here

1 Ответ

1 голос
/ 06 апреля 2020

Действительно ли он должен быть класса Posixct для отображения в таблице? Почему бы просто не преобразовать его в часовой пояс CST, а затем преобразовать даты в символ?

На ваш второй вопрос о том, что номера строк у вас белые, мы можем использовать пользовательские теги css, чтобы определить цвета строк и включить CSS в tags$head(tags$style(HTML()))). Мы можем добавить CSS, который вы использовали в этом же вызове. Обратите внимание, что CSS, определенный здесь, влияет на цвета номеров строк. Цвет столбца со строками данных определяется как backgroundColor = styleEqual(df$Timestamp, row_colours). Мы используем CSS, чтобы сопоставить цвет номера строки с цветом остальной части строки.

library(shiny)
library(shinythemes)
library(data.table)
library(DT)
library(timeDate)

df <- structure(c(1586136680.0005, 1586136711.0005, 1586136741.0005,1586136861.0005, 1586136861.0005,
                  1586136801.0005, 1586136831.0005, 1586136861.0005), class = c("POSIXct", 
                                                                                "POSIXt"), tzone = "") 

df <- data.frame(Timestamp = df)

df$Timestamp <- as.character(.POSIXct(df$Timestamp-3600*7, tz="CST6CDT"))

l_agg <- 10

ui <- fluidPage(

  tags$head(tags$style(HTML('

  table th {
    background:#4e5d6c;
}

  table tr:nth-child(odd) td{
           background:#2B3E50;
}
table tr:nth-child(even) td{
            background:#4e5d6c;
}

div.dataTables_scrollHead span {color: black;}

'))),

  theme = shinytheme("superhero"),
  DT::dataTableOutput("mytable")

) 

if (!round(length(df$Timestamp)/2,0) %% 2) {
  row_colours <- rep(c('#2B3E50', '#4e5d6c'), length(df$Timestamp)/2)
  } else {
  row_colours <- rep(c('#2B3E50', '#4e5d6c'), round(length(df$Timestamp)/2,0))[-length(df$Timestamp)]
}

server <- function(input, output, session) {
  output$mytable     <- DT::renderDataTable(DT::datatable(df,rownames = T,
                                                          filter="top", 
                                                          extensions = "FixedColumns",style = 'bootstrap',
                                                          options = list(scrollX = TRUE, scrollY = TRUE,
                                                                         autoWidth = F,
                                                                         columnDefs = list(list(width = '1444px', targets = c(1))),
                                                                         fixedColumns=list(eftColumns=1))) 
                                            %>%formatRound(c(2:l_agg), 2)%>% formatStyle('Timestamp',backgroundColor = styleEqual(df$Timestamp, row_colours)))
}

shinyApp(ui, server)

enter image description here

...