shiny | 使用R创建一个网页应用（Web App）

借助shiny工具包可以使用R代码创建网页App（Web Application）。在RStudio的官网上，还提供了一套基础的学习手册，共7节课程^[1]和4个练习项目^[2]，详见链接：https://shiny.rstudio.com/tutorial/#get-started：

课程链接：https://shiny.rstudio.com/tutorial/written-tutorial/lesson1/
练习链接：https://rstudio-education.github.io/shiny-course/

1 简介

1.1 一般流程

使用shiny工具包创建网页App有一套模板化的流程：

首先，创建一个本地文件夹，之后所有相关文件如R代码、数据都放置在该文件夹内；
第二，从Rstudio中创建一个普通的R文件（.R）保存在上述文件夹中，一般命名为app.R（也可自定义名称，但不推荐），作为主文件；其他文件根据需求放置；
第三，app.R的内容也是模板化的，包括ui、server和调用shinyApp()函数三部分，其中第三部分的内容是固定的，因此需要改动的只有前两部分。

当一个.R文件具有上述三个部分时，RStudio的界面就会自动变化，出现Run App按钮，用户点击后就会打开一个网页App（程序可运行的情况下）。

标准界面

app.R界面

app.R的一般样式如下：

library(shiny)# Define UI ----
ui <- fluidPage()# Define server logic ----
server <- function(input, output) {}# Run the app ----
shinyApp(ui = ui, server = server)

将上述代码复制到app.R中，点击运行按钮后可以得到一个空白网页，此时版本记为App V1。

1.2 快捷方法

在RStudio中，依次点击File - New File（前两步可以通过点击File下方的加号代替） - Shiny Web App...，就会弹出一个如下所示的对话框：

其中上面红框中填入的是文件夹名称，下面红框中是文件夹路径；点击Creat后就创建了一个包含app.R文件的文件夹。app.R文件会自动在RStudio中打开，点击Run App会运行出一个示例App，再点击网页右上角的关闭按钮App就会停止运行。

用户可以直接在app.R文件的基础上进行修改以创建自己的App。

读者也可按照快捷方法创建一个Shiny App，再使用App V1的内容替换app.R的内容，作为App V1。

2 定义`ui`

这部分的功能是设计用户界面（User Interface，UI），所有的内容都添加在fluidPage()函数内部。不过，若需要加载工具包或数据，一般应在定义ui之前。

# Define UI ----
ui <- fluidPage()

2.1 布局函数

最常使用的布局函数是sidebarLayout()，它使网页分成如下两个部分：左侧是操作面板，右侧是显示面板（位置也可互换）。

图片来源：https://minecr.shinyapps.io/01-hello/#section-user-interface-ui

在该函数内部，再分别使用sidebarPanel()和mainPanel()函数定义两个面板，两个函数之间需用使用逗号,隔开。

ui <- fluidPage(titlePanel("Shiny App的标题"),sidebarLayout(sidebarPanel(),mainPanel())
)

使用以上代码替换App V1中的ui部分，记为App V2。

更多布局函数^[3]见：https://shiny.rstudio.com/articles/layout-guide.html

2.2 添加控件

在本部分之前，官网课程LESSON 2介绍了如何在面板中设置HTML文本、加载图片等内容，这里跳过这些内容；有需要的读者可以通过这个链接自学：https://shiny.rstudio.com/tutorial/written-tutorial/lesson2/。

控件（Control Widget）包括点击按钮、单选框、复选框、下拉框、输入框、日期选择器等，每个类型的控件都对应着相应的函数。控件是在操作面板中进行设置的，因此相关函数需要在sidebarPanel()函数内部使用。

常见的控件形式如下图所示：

图片来源：https://minecr.shinyapps.io/01-hello/#section-user-interface-ui

各函数对应的控件类型如下：

actionButton()：点击按钮
checkboxGroupInput()：复选框
checkboxInput()：单选框
dateInput()：日期选择器
dateRangeInput()：日期范围选择器
fileInput()：文件加载按钮
helpText()：添加帮助文本
numericInput()：数字输入框
radioButtons()：圆形选择框
selectInput()：下拉框
sliderInput()：滑动条
submitButton()：提交按钮
textInput()：文本输入框

比如创建一个下拉框和复选框：

sidebarPanel(selectInput(inputId = "class",label = "班级",choices = c("1班" = 1, "2班" = 2, "3班" = 3),selected = "1班"),checkboxGroupInput(inputId = "subject", label = "学科",choices = c("语文" = "Chinese", "数学" = "Math", "英语" = "English","物理" = "Physics", "历史" = "Histroy"),selected = c("Chinese", "English"))
)

使用上述代码替换App V2中的sidebarPanel()部分，记为App V3。

运行App V3的结果如下图所示：

上述使用的两个控件函数都包括如下四个参数：

inputId：相当于控件的变量名，方便后面对其内容进行调用；
label：显示在面板中的控件标签，如不需要可设置为""；
choices：可供选择的项；等号前表示实际显示内容，等号后表示真实变量名称；
selected：控件在初始状态下的选择项。

参数因控件函数而异，但inputId和label是共有参数，详见https://shiny.rstudio.com/tutorial/written-tutorial/lesson3/。

2.3 定义输出形式

输出形式是在mainPanel()函数内部定义的，不同的输出形式对应着相应的函数：

dataTableOutput()：表格
htmlOutput()：网页
imageOutput()：图片
plotOutput()：绘图
tableOutput()：表格
textOutput()：文本
uiOutput()：网页
verbatimTextOutput()：文本

如下定义一个绘图输出项：

mainPanel(plotOutput(outputId = "plot")
)

使用上述代码替换App V3中的mainPanel()部分，记为App V4。

这里的作用是定义输出的形式和输出项名称，真正做出输出动作是在server部分。

3 定义`server`

这部分实际上是定义一个如下形式的函数（session参数可省略）：

server <- function(input, output, session){}

这里的input参数就是2.2节中sidebarPanel()函数内部控件的选择项，如input$subject、input$class；output参数就是2.3节mainPanel()函数内部定义的输出项，如output$plot。

由于下文需要做出输出动作，我们先定义一个示例数据：

library(ggplot2)
library(tidyr)
set.seed(0814)
data <- data.frame(ID = rep(1:300, 5),class = rep(1:3, 500),subject = rep(c("Chinese", "Math", "English", "Physics", "Histroy"), each = 300),grade = as.integer(runif(500, 30, 100))
)data <- spread(data, key = "subject", value = "grade")

将上述代码复制到App V4中library(shiny)和定义ui之间，记为App V5。

与2.3节*Output函数相对应的是render*函数：

renderDataTable()
renderImage()
renderPlot()
renderPrint()
renderTable()
renderText()
renderUI()

如下代码：

server <- function(input, output) {output$plot <- renderPlot({data0 <- data[data$class == input$class, ]ggplot(data0, aes_string(x = input$subject[1], y = input$subject[2])) +geom_point() +geom_smooth(method = "lm") +theme_bw() })
}

使用上述代码替换App V5中的server部分，记为App V6。

需要注意的是：renderPlot()函数是与前面的plotOutput()对应的，该函数内只能写一句完整的语句，如果有多个语句，需要使用大括号{}；output$plot则与outputId = "plot"相对应。

至此，一个简单的网页App就完成了，效果如下：

「参考资料」

[1]

shiny学习课程: https://shiny.rstudio.com/tutorial/written-tutorial/lesson1/

[2]

shiny练习项目: https://rstudio-education.github.io/shiny-course/

[3]

shiny布局函数: https://shiny.rstudio.com/articles/layout-guide.html