У меня в блестящем приложении есть tabpanelSet. Одна из вкладок содержит таблицу данных. Мне бы хотелось, чтобы количество строк в таблице данных отображалось красивым круглым значком рядом с текстом заголовка вкладки, чтобы пользователь мог видеть номер в таблице данных на вкладке, прежде чем щелкнуть вкладку.

Вот базовое приложение. Это вкладка «Подробности», в которой мне нужна библиотека значков круговых уведомлений.

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

ui <- fluidPage(

    # Application title
    titlePanel("Circular notification icon app"),

        mainPanel(
            tabsetPanel(type = "tabs",
                        tabPanel("Empty"),
                        tabPanel("Details",
                                 DT::dataTableOutput("iris"))
            )
        )
)

server <- function(input, output) {

    output$iris = DT::renderDT({
        datatable(iris,class = "display wrap",selection = "single",
                  options = list(
                      scrollX = TRUE,
                      scrollY = TRUE,
                      pageLength = 15,
                      select = "api",
                      dom = 'Bfrtip')
        )
    })
}

# Run the application
shinyApp(ui = ui, server = server)
2
Sebastian Zeki 26 Июн 2020 в 13:19

1 ответ

Лучший ответ

Как это?

library(shiny)
library(DT)
library(shinyjs)

CSS <- "
#tabHeader {
  display: inline-block;
}
.circle {
  display: inline-block;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  font-size: 12px;
  color: #fff;
  line-height: 25px;
  text-align: center;
  background: #000
}"

js <- function(nrows){
  sprintf("$('#tabHeader .circle').html('%s');", nrows)
}


ui <- fluidPage(
  
  useShinyjs(),
  
  tags$head(
    tags$style(HTML(CSS))
  ),
  
  # Application title
  titlePanel("Circular notification icon app"),
  
  mainPanel(
    tabsetPanel(type = "tabs",
                tabPanel("Empty"),
                tabPanel(div(id = "tabHeader", span("Details"), 
                             div(class = "circle")),
                         DTOutput("iris"))
    )
  )
  
)


server <- function(input, output) {
  
  runjs(js(nrow(iris)))
  
  output$iris = renderDT({
    datatable(iris, class = "display wrap", selection = "single",
              options = list(
                scrollX = TRUE,
                scrollY = TRUE,
                pageLength = 15,
                select = "api",
                dom = 'Bfrtip')
    )
  })
  
}

# Run the application
shinyApp(ui = ui, server = server)

enter image description here

3
Stéphane Laurent 26 Июн 2020 в 10:53