首页 > 解决方案 > 无法在 R Shiny 应用程序中嵌入 Bookdown 网站

问题描述

我有一个 Bookdown 网站,我想将它嵌入到 R Shiny 应用程序中,但是我遇到了一个问题,即只有顶部工具栏正确呈现。我正在使用基本的 Bookdown 模板并使用该gitbook选项呈现网站,然后尝试将 html 文件嵌入到 R Shiny 应用程序中,如下面的代码所示。

全屏显示时,仅顶部工具栏可见: R Shiny 应用程序的全屏图像,仅显示 Bookdown 站点的顶部工具栏

当窗口变小时,很明显内容的主体正在被渲染,但在靠近顶部的一个非常小的盒子里: R Shiny 应用程序的图像未全屏显示,Bookdown 站点的顶部工具栏可见,以及带有滚动条的小框中的一小段正文内容

目前还不清楚为什么会发生这种情况,我已经尝试过使用更大的 R Shiny 应用程序以及下面的极简主义示例。我最初尝试使用较大的 Bookdown 站点,然后使用较小的示例(包括此处的 reprex 中的单页站点)进行尝试。是什么导致了这种奇怪的渲染,是否可以在闪亮的应用程序环境中解决这个问题?

服务器.R 文件

library(shiny)
library(htmltools)

shinyServer(function(input, output, session) {

  output$ui <- renderUI({
    htmltools::includeHTML("./www/index.html")
  })

})

ui.R 文件

library(shiny)

shinyUI(
  uiOutput("ui")
)

_bookdown.yml

book_filename: "Bookdown Reprex"
output_dir: www
delete_merged_file: true
language:
  label:
    fig: "FIGURE "
    tab: "TABLE "
  ui:
    chapter_name: ""

_output.yml

bookdown::pdf_book:
  keep_tex: yes
  latex_engine: xelatex
  pandoc_args: --top-level-division=chapter
  toc_depth: 2
  toc_unnumbered: no
bookdown::gitbook:
  css: css/style.css
  split_by: chapter
  lib_dir: book_assets
  config:
    toc:
      collapse: chapter
    download: pdf
    sharing: no

索引.Rmd

---
title: "Bookdown Reprex"
date: "`r Sys.Date()`"
fontsize: 11pt
geometry: margin=1in
mainfont: FreeSans
site: bookdown::bookdown_site
always_allow_html: yes
colorlinks: yes
---

Introduction
============

```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = TRUE)
```

## R Markdown

This is an R Markdown document. Markdown is a simple formatting syntax for authoring HTML, 
PDF, and MS Word documents. For more details on using R Markdown see 
<http://rmarkdown.rstudio.com>.

When you click the **Knit** button a document will be generated that includes both content 
as well as the output of any embedded R code chunks within the document. You can embed an 
R code chunk like this:

```{r cars}
summary(cars)
```

样式.css

p.caption{
  color: #777;
  margin-top: 10px;
}
p code {
  white-space: inherit;
}
pre {
  word-break: normal;
  word-wrap: normal;
}
pre code {
  white-space: inherit;
}

标签: rshinybookdown

解决方案


推荐阅读