ลดขนาดตัวอักษรใน renderDataTable ในงานนำเสนอที่สวยงาม

ฉันกำลังใช้การนำเสนอแบบวาววับเพื่อแสดงสองตาราง นี่คือรหัสของฉัน:

tabsetPanel(
  tabPanel('iris',
           renderDataTable(iris,options = 
list(lengthMenu = c(5, 10), pageLength = 5, scrollX = TRUE), escape = 
FALSE)), 
  tabPanel('mtcars',
           renderDataTable(mtcars, options = list(lengthMenu 
= c(5, 10), pageLength = 5, scrollX = TRUE), escape = FALSE))
)

ฉันต้องการย่อขนาดของตาราง ฉันพยายามเพิ่ม div ด้วยวิธีต่อไปนี้:

div(renderDataTable(mtcars, options = list(lengthMenu 
= c(5, 10), pageLength = 5, scrollX = TRUE), escape = FALSE), style = "font-
size:50% ")

แต่นี่ไม่ทำงาน

ฉันลองทำสิ่งนี้ด้วย:

mainPanel( 
  tabsetPanel(id='BLMS', 
              tabPanel("iris", fluidRow(div(dataTableOutput(outputId="iris"),  
style = "font-size:50%"))), 
              tabPanel("mtcars", 
fluidRow(div(dataTableOutput(outputId="mtcars"),  style = "font-size:50%")))
              )
  )  

output$iris<- renderDataTable({iris}, options = list(lengthMenu = c(5, 10), 
pageLength = 5, scrollX = TRUE))

output$mtcars<- renderDataTable({mtcars},options = list(lengthMenu = c(5, 
10), pageLength = 5, scrollX = TRUE))

แต่มันแสดงตารางที่ถูกตัดครึ่งหนึ่งในการนำเสนอ


person Maggie    schedule 09.06.2017    source แหล่งที่มา
comment
font-size จะลดขนาดตัวอักษรเท่านั้น คุณได้ลอง width ด้วย แล้วหรือยัง   -  person Roman Luštrik    schedule 09.06.2017
comment
ใช่ มันไม่ได้แสดงอะไรอย่างถูกต้อง   -  person Maggie    schedule 09.06.2017


คำตอบ (1)


หากคุณต้องการลดขนาดของตาราง ให้วางไว้ในคอลัมน์ที่มี width ‹ 12 หากคุณต้องการลดขนาดตัวอักษร นอกจากนี้ Shinyjs::inlineCSS ก็มีประโยชน์:

library(DT)
library(shinyjs)
shinyApp(shinyUI(
  fluidPage(column(width=6, dataTableOutput("iris")),
        useShinyjs(),
        inlineCSS(list("table" = "font-size: 8px")))
  ),

  shinyServer(function(input, output) {
    output$iris = renderDataTable({
        datatable(iris,options =
                    list(lengthMenu = c(5, 10), pageLength = 5, scrollX = TRUE), escape =
                    FALSE)
    })
  })
)

ป้อนคำอธิบายรูปภาพที่นี่

แก้ไข: ตามที่อธิบายไว้ การเพิ่ม style คำสั่งให้กับ div ของคุณที่มีตารางจะทำงานได้ดียิ่งขึ้น: fluidPage(style = "font-size: 75%; width: 75%", dataTableOutput("iris")))

person shosaco    schedule 10.06.2017