R+ECharts2Shiny实现web动态交互式可视化数据(上)

作者： 糖甜甜甜 ，R语言中文社区专栏作者

公众号：经管人学数据分析

前言

之前过年的时候有好友询问，没有太多web和开发的基础，但是想在掌握R语言的基础上，实现web动态交互式可视化公司的业务数据，百度的Echarts，它最初是为了满足企业商业体系里各种业务系统（如凤巢、广告管家等等）的报表需求，后来发展成为一个纯Javascript的商业级数据图表库。但是对于普通没有开发经验的小白，无法完全能运用该库到自己的web项目中，那么R语言的ECharts2Shiny就可以轻松实现以上需求。

在学习ECharts2Shiny前，我们先来了解下如何用R Shiny包来构建应用程序。在掌握了Shiny后，即可轻松实现用ECharts2Shiny实现web动态交互式可视化数据。

1、Hello Shiny!

我们先从简单的将Hello Shiny展示在你的应用程序上，效果如下，可以选择在浏览器查看效果。

要运行这个例子，只需键入：

1library(shiny) 2runExample("01_hello") 

Shiny应用程序分为两个部分：用户界面定义和服务端脚本。

用户界面是在源文件ui.R中定义的，这里举例在用户界面展示一个生成正态分布的随机数，随机数个数可以由用户定义，并且绘制这些随机数的直方图：

UI.R

 1library(shiny)
 2
 3# Define UI for app that draws a histogram ----
 4ui <- fluidPage(
 5
 6  # App title ----
 7  titlePanel("Hello Shiny!"),
 8
 9  # Sidebar layout with input and output definitions ----
10  sidebarLayout(
11
12    # Sidebar panel for inputs ----
13    sidebarPanel(
14
15      # Input: Slider for the number of bins ----
16      sliderInput(inputId = "bins",
17                  label = "Number of bins:",
18                  min = 1,
19                  max = 50,
20                  value = 30)
21
22    ),
23
24    # Main panel for displaying outputs ----
25    mainPanel(
26
27      # Output: Histogram ----
28      plotOutput(outputId = "distPlot")
29
30    )
31  )
32)

服务端的代码。生成给定个数的随机变量，然后将直方图画出来。代码中返回图形的函数被renderPlot封装后传递给output$distPlot。

server.R

 1# Define server logic required to draw a histogram ----
 2server <- function(input, output) {
 3
 4  # Histogram of the Old Faithful Geyser Data ----
 5  # with requested number of bins
 6  # This expression that generates a histogram is wrapped in a call
 7  # to renderPlot to indicate that:
 8  #
 9  # 1. It is "reactive" and therefore should be automatically
10  #    re-executed when inputs (input$bins) change
11  # 2. Its output type is a plot
12  output$distPlot <- renderPlot({
13
14    x    <- faithful$waiting
15    bins <- seq(min(x), max(x), length.out = input$bins + 1)
16
17    hist(x, breaks = bins, col = "#75AADB", border = "white",
18         xlab = "Waiting time to next eruption (in mins)",
19         main = "Histogram of waiting times")
20
21    })
22
23}
24
25# Create Shiny app ----
26shinyApp(ui = ui, server = server)

再来看一个例子，运行下面的代码：

1runExample("02_text")

得到如下效果：

下面是用户界面定义的代码。sidebarPanel和mainPanel的函数调用中各有两个参数对应于上面用户界面中的左边两个输入和右边两个输出。

UI.R

 1library(shiny)
 2
 3# Define UI for dataset viewer app ----
 4ui <- fluidPage(
 5
 6  # App title ----
 7  titlePanel("Shiny Text"),
 8
 9  # Sidebar layout with a input and output definitions ----
10  sidebarLayout(
11
12    # Sidebar panel for inputs ----
13    sidebarPanel(
14
15      # Input: Selector for choosing dataset ----
16      selectInput(inputId = "dataset",
17                  label = "Choose a dataset:",
18                  choices = c("rock", "pressure", "cars")),
19
20      # Input: Numeric entry for number of obs to view ----
21      numericInput(inputId = "obs",
22                   label = "Number of observations to view:",
23                   value = 10)
24    ),
25
26    # Main panel for displaying outputs ----
27    mainPanel(
28
29      # Output: Verbatim text for data summary ----
30      verbatimTextOutput("summary"),
31
32      # Output: HTML table with requested number of observations ----
33      tableOutput("view")
34
35    )
36  )
37)

服务端的程序包括一个反应性表达式来返回用户选择的相应数据集。还有两个渲染表达式renderPrint和renderTable来对应用户的输入返回输入值到界面上。

server.R

 1# Define server logic to summarize and view selected dataset ----
 2server <- function(input, output) {
 3
 4  # Return the requested dataset ----
 5  datasetInput <- reactive({
 6    switch(input$dataset,
 7           "rock" = rock,
 8           "pressure" = pressure,
 9           "cars" = cars)
10  })
11
12  # Generate a summary of the dataset ----
13  output$summary <- renderPrint({
14    dataset <- datasetInput()
15    summary(dataset)
16  })
17
18  # Show the first "n" observations ----
19  output$view <- renderTable({
20    head(datasetInput(), n = input$obs)
21  })
22
23}
24
25# Create Shiny app ----
26shinyApp(ui = ui, server = server)

Shiny的web框架从本质上说是使从页面中获取输入值并传递给R，然后把R代码的结果以输入值的形式返回给页面。

Shiny的原理

shiny程序是个简单的目录，里面包括用户接口的定义、服务端脚本以及起支持作用的数据、脚本和其他资源。构建应用程序之初，先建一个空目录，在这个目录里创建空文件 UI.R  和  server.R 。

在构建自己的应用时， UI.R 中有三个函数titlePanel、sidebarPanel和mainPanel定义了用户接口的不同区域。titlePanel用来添加用户界面的标题，比如前面例子中的Hello Shiny!和Shiny Text。sidebarPanel上添加输入，比如前面的例子中的选择框。mainPanel用来为用户接口显示输出，在主UI面板上添加元素来渲染在用户界面的输出值。

服务端实现定义程序的脚本，用来接收输入，并计算输出。 server.R 中调用 shinyServer 并传递给它一个函数，用来接收两个参数： 使用input对象的组件来访问输入，并通过向output对象的组件赋值来生成输出。

总

结

到目前我们已经学会了如何用shiny创建一个自己的应用，在下一节中将介绍如何实现在shiny中调用Echarts包来实现将自己的业务数据可视化在web上。如果期待下节内容的话请在下面回复、点下小卡片吧！


参

考

1. https://cran.r-project.org/web/packages/ECharts2Shiny/ECharts2Shiny.pdf

2. https://github.com/XD-DENG/ECharts2Shiny

3. http://yanping.me/shiny-tutorial/

往期精彩：

• 用人工智能方法计算水果难题------遗传算法篇

• R_空间插值_必知必会（一）

• R语言网络爬虫经验

• R语言中文社区2018年终文章整理（作者篇）

• R语言中文社区2018年终文章整理（类型篇）

公众号后台回复关键字即可学习

本文由R语言中文社区 创作，采用 知识共享署名-相同方式共享 3.0 中国大陆许可协议 进行许可。

转载、引用前需联系作者，并署名作者且注明文章出处。

本站文章版权归原作者及原出处所有 。内容为作者个人观点， 并不代表本站赞同其观点和对其真实性负责。本站是一个个人学习交流的平台，并不用于任何商业目的，如果有任何问题，请及时联系我们，我们将根据著作权人的要求，立即更正或者删除有关内容。本站拥有对此声明的最终解释权。