Fatal编程技术网
  • r/
  • R 使用HTMLUI（index.HTML）将交互式图表添加到Shiny

R 使用HTMLUI（index.HTML）将交互式图表添加到Shiny

r shiny

R 使用HTMLUI（index.HTML）将交互式图表添加到Shiny,r,shiny,nvd3.js,rcharts,ggvis,R,Shiny,Nvd3.js,Rcharts,Ggvis,我可以看到ggvis、rCharts等如何与server.r+ui.r结构相适应。我现在正在尝试创建一个HTML UI，但是我无法找到有关将交互式图表传递到HTML UI的任何线索。有什么线索吗 对ggvis、rCharts、NBD3进行调查。没有被详细调查过。避免谷歌 埃文·法雷尔（Evan Farrell）曾提出过类似的问题，但没有回答- 编辑：这些需要自定义绑定吗？还有更简单的选择吗？我认为输出将是javascript生成的SVG，那么库不可能手动包含，SVG只绑定到div元素吗 编辑2：

我可以看到ggvis、rCharts等如何与server.r+ui.r结构相适应。我现在正在尝试创建一个HTML UI，但是我无法找到有关将交互式图表传递到HTML UI的任何线索。有什么线索吗

对ggvis、rCharts、NBD3进行调查。没有被详细调查过。避免谷歌

埃文·法雷尔（Evan Farrell）曾提出过类似的问题，但没有回答-

编辑：这些需要自定义绑定吗？还有更简单的选择吗？我认为输出将是javascript生成的SVG，那么库不可能手动包含，SVG只绑定到div元素吗

编辑2：我是否可以将数据集以某种方式传递到用户界面，并在index.html本身构建一个D3图表

您可以找到一些示例，例如使用ggvis可以使其发光：

library(shiny)
library(ggvis)

runApp(list(

  ui={
    library(ggvis)
    shinyUI(pageWithSidebar(
      div(),
      sidebarPanel(
        sliderInput("n", "Number of points", min = 1, max = nrow(mtcars),
                    value = 10, step = 1),
        uiOutput("plot_ui")
      ),
      mainPanel(
        htmlOutput("ggvis_plot"),
        tableOutput("mtc_table")
      )
    ))

  },

  server={
    library(ggvis)
    shinyServer(function(input, output, session) {

      output$ggvis_plot <- renderUI({
        ggvisOutput("plot1")
      })
      # A reactive subset of mtcars
      mtc <- reactive({ mtcars[1:input$n, ] })
      # A simple visualisation. In shiny apps, need to register observers
      # and tell shiny where to put the controls
      mtc %>%
        ggvis(~wt, ~mpg) %>%
        layer_points() %>%
        bind_shiny("plot1")
      output$mtc_table <- renderTable({
        mtc()[, c("wt", "mpg")]
      })
    })
  }
))

库（闪亮）
图书馆（ggvis）
runApp（列表(
用户界面={
图书馆（ggvis）
shinyUI（带侧栏的页面）(
div（），
侧栏面板(
滑块输入（“n”，“点数”，最小值=1，最大值=nrow（mtcars），
值=10，步骤=1），
ui输出（“绘图ui”）
),
主面板(
htmlOutput（“ggvis_图”），
表格输出（“mtc_表格”）
)
))
},
服务器={
图书馆（ggvis）
shinyServer（功能（输入、输出、会话）{
输出$ggvis_绘图%
图层_点（）%>%
绑定（图1）

输出$mtc_table您可以使用Shiny、ggplot2和Plotly生成交互式的基于web的绘图。绘图使用D3.js呈现，并且可以进行编辑

一般来说，这意味着您有两种选择。首先，生成一个带有交互式图形的闪亮应用程序并嵌入整个应用程序。其次，从闪亮应用程序中生成交互式图形，然后嵌入该图形

有关使用Shiny创建交互式图形的代码和说明，请参见。此方法允许您创建如下交互式图形：






通过一个简单的谷歌搜索，你可以找到很多示例。首先，请转到本页末尾：''使用一个基本的ggvis/shiny示例。谢谢@hvollmeier，我正在努力将ui.r部分转换为可以使用HTML ui的部分。你对此有什么建议吗？如果你使用HTML-u，你根本不应该有ui.r文件i、 基本上，您会将index.html文件替换为“ui.r”文件，并将其放入“www”目录中（该目录是项目目录的子目录）.看看这个链接是的，我也明白。你现在能帮我把这两个拼凑起来吗？我可以写一个HTML UI，我可以通过UI.r来绘制ggvis。现在我如何通过HTML UI来绘制ggvis？谢谢@Stanislav。我可以正确地看到表格，但没有散点图。div
绘图设备图标
已填充，但div
已填充>plot
为空。运行时是否看到相同的结果？是的，但是，当我在另一台计算机上尝试时，我必须首先使用ui.R运行整个示例，可能是为了生成所有包含。所谓包含，是指正在源代码中的脚本和CSS（我是新手：）？以前运行ui不是我的选择，因为我也必须与其他人共享此应用程序。完成：从ui.R中删除“ggvisOutput”，现在它可以工作了。我不明白。HTML ui对我不起作用。我根本不测试ui.R。

<shinnyappName>
|-- www
     |-- index.html
|-- server.R



<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <script type="application/shiny-singletons"></script>
  <script type="application/html-dependencies">json2[2014.02.04];jquery[1.11.0];shiny[0.11.1];ionrangeslider[2.0.2];bootstrap[3.3.1]</script>
<script src="shared/json2-min.js"></script>
<script src="shared/jquery.min.js"></script>
<link href="shared/shiny.css" rel="stylesheet" />
<script src="shared/shiny.min.js"></script>
<link href="shared/ionrangeslider/css/normalize.css" rel="stylesheet" />
<link href="shared/ionrangeslider/css/ion.rangeSlider.css" rel="stylesheet" />
<link href="shared/ionrangeslider/css/ion.rangeSlider.skinShiny.css" rel="stylesheet" />
<script src="shared/ionrangeslider/js/ion.rangeSlider.min.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link href="shared/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
<script src="shared/bootstrap/js/bootstrap.min.js"></script>
<script src="shared/bootstrap/shim/html5shiv.min.js"></script>
<script src="shared/bootstrap/shim/respond.min.js"></script>

</head>
<body>
  <div class="container-fluid">
    <div class="row">
      <div></div>
    </div>
    <div class="row">
      <div class="col-sm-4">
        <form class="well">
          <div class="form-group shiny-input-container">
            <label class="control-label" for="n">Number of points</label>
            <input class="js-range-slider" id="n" data-min="1" data-max="32" data-from="10" data-step="1" data-grid="true" data-grid-num="7.75" data-grid-snap="false" data-prettify-separator="," data-keyboard="true" data-keyboard-step="3.2258064516129"/>
          </div>
          <div id="plot_ui" class="shiny-html-output"></div>
        </form>
      </div>
      <div class="col-sm-8">
        <div id="ggvis_plot" class="shiny-html-output"></div>
        <div id="mtc_table" class="shiny-html-output"></div>
      </div>
    </div>
  </div>
</body>
</html>



 library(shiny)
 runApp("<shinyAppName>")