我正在R中构建一个Shiny应用程序以显示多个数据框，在1个Shiny页面上共有6个。我能够在Shiny条件格式化1个数据表，但我无法有条件地格式化所有6个表。 6个表中的每一个都有5个变量，我希望每个数据表中都有第二个变量：如果＆gt; = 75，背景亮红色和粗体，如果＆lt; = 75，则亮绿色和粗体：
library(shiny)
ui <- fluidPage(
titlePanel("xxx"),
title = 'xx',
fluidRow(
column(6
, fluidRow(
column(6, DT::dataTableOutput('1'), style = "font-size:
75%; width: 50%"),
column(6, DT::dataTableOutput('2'), style = "font-size:
75%; width: 50%")
),
# hr(),
fluidRow(
column(6, DT::dataTableOutput('3'), style = "font-size:
75%; width: 50%"),
column(6, DT::dataTableOutput('4'), style = "font-size:
75%; width: 50%")
),
# hr(),
fluidRow(
column(6, DT::dataTableOutput('5'), style = "font-size:
75%; width: 50%"),
column(6, DT::dataTableOutput('6'), style = "font-size:
75%; width: 50%")
)
)
server <- function(input, output) {
output$1 = DT::renderDataTable(1
, server = FALSE, selection = 'single'
, options = list(rowCallback = JS('function(nRow
, aData, iDisplayIndex, iDisplayIndexFull) {
// Bold and green cells for conditions
if (parseFloat(aData[2])
>= 75 | parseFloat(aData[2]) <= -75)
$("td:eq(2)", nRow).css("font-weight", "bold");
if (parseFloat(aData[2]) >= 75)
$("td:eq(2)", nRow).css("background-color"
, "#FF0000");
else if(parseFloat(aData[2]) <= -75)
$("td:eq(2)", nRow).css("background-color",
"#00FF00");
else
$("td:eq(2)", nRow).css("background-color"
, "#FFFFFF");
}'
)
, drawCallback = JS()
))
output$2 = DT::renderDataTable(2, server = FALSE,
selection = 'single')
output$3 = DT::renderDataTable(3, server = FALSE,
selection = 'single')
output$4 = DT::renderDataTable(4, server = FALSE,
selection = 'single')
output$5 = DT::renderDataTable(5, server = FALSE,
selection = 'single')
output$6 = DT::renderDataTable(6, server = FALSE,
selection = 'single')
答案 0 :(得分：1)
我已经尝试过您的代码，它对我来说效果很好，请看下面的内容：
library(shiny)
library(DT)
ui <- fluidPage(
titlePanel("xxx"),
title = 'xx',
fluidRow(
column(12
, fluidRow(
column(6, DT::dataTableOutput('Table1'), style = "font-size:
75%; width: 50%"),
column(6, DT::dataTableOutput('Table2'), style = "font-size:
75%; width: 50%")
),
# hr(),
fluidRow(
column(6, DT::dataTableOutput('Table3'), style = "font-size:
75%; width: 50%"),
column(6, DT::dataTableOutput('Table4'), style = "font-size:
75%; width: 50%")
),
# hr(),
fluidRow(
column(6, DT::dataTableOutput('Table5'), style = "font-size:
75%; width: 50%"),
column(6, DT::dataTableOutput('Table6'), style = "font-size:
75%; width: 50%")
)
)))
server <- function(input, output) {
output$Table1 = DT::renderDataTable(mtcars
, server = FALSE, selection = 'single'
, options = list(rowCallback = JS('function(nRow
, aData, iDisplayIndex, iDisplayIndexFull) {
// Bold and green cells for conditions
if (parseFloat(aData[2])
>= 1 | parseFloat(aData[2]) <= 3)
$("td:eq(2)", nRow).css("font-weight", "bold");
if (parseFloat(aData[2]) >= 1)
$("td:eq(2)", nRow).css("background-color"
, "#FF0000");
else if(parseFloat(aData[2]) <= 3)
$("td:eq(2)", nRow).css("background-color",
"#00FF00");
else
$("td:eq(2)", nRow).css("background-color"
, "#FFFFFF");
}'
)))
output$Table2 = DT::renderDataTable(iris, server = FALSE,
selection = 'single', options = list(rowCallback = JS('function(nRow
, aData, iDisplayIndex, iDisplayIndexFull) {
// Bold and green cells for conditions
if (parseFloat(aData[2])
>= 1 | parseFloat(aData[2]) <= 3)
$("td:eq(2)", nRow).css("font-weight", "bold");
if (parseFloat(aData[2]) >= 1)
$("td:eq(2)", nRow).css("background-color"
, "#FF0000");
else if(parseFloat(aData[2]) <= 3)
$("td:eq(2)", nRow).css("background-color",
"#00FF00");
else
$("td:eq(2)", nRow).css("background-color"
, "#FFFFFF");
}'
)))
output$Table3 = DT::renderDataTable(iris, server = FALSE,
selection = 'single', options = list(rowCallback = JS('function(nRow
, aData, iDisplayIndex, iDisplayIndexFull) {
// Bold and green cells for conditions
if (parseFloat(aData[2])
>= 1 | parseFloat(aData[2]) <= 3)
$("td:eq(2)", nRow).css("font-weight", "bold");
if (parseFloat(aData[2]) >= 1)
$("td:eq(2)", nRow).css("background-color"
, "#FF0000");
else if(parseFloat(aData[2]) <= 3)
$("td:eq(2)", nRow).css("background-color",
"#00FF00");
else
$("td:eq(2)", nRow).css("background-color"
, "#FFFFFF");
}'
)))
output$Table4 = DT::renderDataTable(iris, server = FALSE,
selection = 'single', options = list(rowCallback = JS('function(nRow
, aData, iDisplayIndex, iDisplayIndexFull) {
// Bold and green cells for conditions
if (parseFloat(aData[2])
>= 1 | parseFloat(aData[2]) <= 3)
$("td:eq(2)", nRow).css("font-weight", "bold");
if (parseFloat(aData[2]) >= 1)
$("td:eq(2)", nRow).css("background-color"
, "#FF0000");
else if(parseFloat(aData[2]) <= 3)
$("td:eq(2)", nRow).css("background-color",
"#00FF00");
else
$("td:eq(2)", nRow).css("background-color"
, "#FFFFFF");
}'
)))
output$Table5 = DT::renderDataTable(iris, server = FALSE,
selection = 'single', options = list(rowCallback = JS('function(nRow
, aData, iDisplayIndex, iDisplayIndexFull) {
// Bold and green cells for conditions
if (parseFloat(aData[2])
>= 1 | parseFloat(aData[2]) <= 3)
$("td:eq(2)", nRow).css("font-weight", "bold");
if (parseFloat(aData[2]) >= 1)
$("td:eq(2)", nRow).css("background-color"
, "#FF0000");
else if(parseFloat(aData[2]) <= 3)
$("td:eq(2)", nRow).css("background-color",
"#00FF00");
else
$("td:eq(2)", nRow).css("background-color"
, "#FFFFFF");
}'
)))
output$Table6 = DT::renderDataTable(iris, server = FALSE,
selection = 'single', options = list(rowCallback = JS('function(nRow
, aData, iDisplayIndex, iDisplayIndexFull) {
// Bold and green cells for conditions
if (parseFloat(aData[2])
>= 1 | parseFloat(aData[2]) <= 3)
$("td:eq(2)", nRow).css("font-weight", "bold");
if (parseFloat(aData[2]) >= 1)
$("td:eq(2)", nRow).css("background-color"
, "#FF0000");
else if(parseFloat(aData[2]) <= 3)
$("td:eq(2)", nRow).css("background-color",
"#00FF00");
else
$("td:eq(2)", nRow).css("background-color"
, "#FFFFFF");
}'
)))}
shinyApp(ui, server)
每个表都按照您的要求突出显示了列。
- ＆gt; 我刚刚更改了DataTable的ID，阅读了DT库并更正了您的括号。
在您的情况下，我会考虑在JS的帮助下，在没有formatStyle()的情况下格式化整个列。
请下次发布reproducible example。
[更新]使用formatStyle（）
的解决方案下面您可以使用formatStyle()选项查看解决方案，对代码的注释仅在特定行旁边。
library(shiny)
library(DT)
ui <- fluidPage(
titlePanel("xxx"),
title = 'xx',
fluidRow(
column(12
, fluidRow(
column(6, DT::dataTableOutput('Table1'), style = "font-size:
75%; width: 50%"),
column(6, DT::dataTableOutput('Table2'), style = "font-size:
75%; width: 50%")
),
# hr(),
fluidRow(
column(6, DT::dataTableOutput('Table3'), style = "font-size:
75%; width: 50%"),
column(6, DT::dataTableOutput('Table4'), style = "font-size:
75%; width: 50%")
),
# hr(),
fluidRow(
column(6, DT::dataTableOutput('Table5'), style = "font-size:
75%; width: 50%"),
column(6, DT::dataTableOutput('Table6'), style = "font-size:
75%; width: 50%")
)
)))
server <- function(input, output) {
output$Table1 = DT::renderDataTable(
datatable(mtcars) %>%
formatStyle('cyl', fontWeight = styleInterval(4, c('normal', 'bold')), # Font bold if cyl > 4
backgroundColor = styleInterval(4, c('green', 'red'))) # Red background if cyl > 4
)
}
shinyApp(ui, server)