在 Shiny 应用程序中包含降价表似乎会破坏 CSS答案

【问题标题】：Including markdown tables in Shiny app seems to break CSS在 Shiny 应用程序中包含降价表似乎会破坏 CSS
【发布时间】：2017-07-14 08:22:20
【问题描述】：

我正在尝试将在 Rmarkdown 中创建的表格包含在 Shiny 应用程序的选项卡中。出于某种原因，虽然 markdown 在编入 HTML 并单独查看时看起来不错，但当表格 CSS 作为 markdown 或 HTML 插入 Shiny 时，它不起作用。

它应该如何/它自己看起来如何（即，当下面的 testdoc.md 被预览为 HTML 时，或者当 testdoc.Rmd 被编织成 HTML 时）：

它在 Shiny 中的样子，首先使用shiny::includeMarkdown，其次使用shiny::includeHTML

您可以看到，在 Shiny 应用程序中，CSS 在第一个表中损坏，在第二个表中有些损坏（对齐错误）。我强烈希望使用includeMarkdown 而不是includeHTML，因为出于某种原因includeHTML 会在我的应用程序中导致其他问题，包括以某种方式阻止允许滑块和选择框工作的Javascript，并取消我的标签自定义CSS .

你可能会问：你为什么要使用markdown？为什么不使用renderTable 在闪亮的表格中包含一个表格？嗯，这个特定的选项卡是一个文档选项卡，包含大量文本和多个表格，并且是很久以前为不同目的而创建的。还有其他最终将包含在内的降价文档。如果能够将它们插入 Shiny 应用程序而无需重新创建或拆分它们以允许使用 Shiny 表，那就太好了。

这可能很容易解决，我对 CSS 了解不多。

MRE 下面。

app.R：

library(shiny)

server <- function(input,output){

}
ui <- fluidPage(titlePanel("Test page"),
  includeMarkdown("testdoc.md"),
  includeHTML("testdoc.html")
)

shinyApp(ui=ui,server=server)

testdoc.Rmd：

Test:

```{r table1, echo=FALSE}
table1 <- matrix(c(-1,0,1,.391,.144,.059,.720,.425,.230,.945,.878,.796,1,1,1),nrow=3)
colnames(table1) <- c("Response","1","2 or less","3 or less","4 or less")
kable(table1,caption="Table 1")
```

testdoc.md（即knitr::knit('testdoc.Rmd')的结果）：

Test:


| Response|     1| 2 or less| 3 or less| 4 or less|
|--------:|-----:|---------:|---------:|---------:|
|       -1| 0.391|     0.720|     0.945|         1|
|        0| 0.144|     0.425|     0.878|         1|
|        1| 0.059|     0.230|     0.796|         1|

testdoc.html 没有包含在此处，但很容易使用 knitr 从 testdoc.Rmd 重新创建。

【问题讨论】：

将includeHTML 与降价文档一起使用的一个问题是，您会得到第二个html、head 和body 部分，并且包含两次javascript，这可能会导致其他部分出现问题您的应用程序。

标签： r shiny r-markdown

【解决方案1】：

一个不完美的解决方法是像这样使用iframe：

library(shiny)

server <- function(input,output){ }
ui <- fluidPage(
  tags$iframe(src = 'testdoc.html', # put testdoc.html to /www
              width = '100%', height = '800px', 
              frameborder = 0, scrolling = 'auto')
)

shinyApp(ui=ui,server=server)

【讨论】：