在 Shiny 应用程序中包含一个 javascript 文件

IT技术 javascript r shiny
2021-02-26 03:52:08

我需要在我的 Shiny 应用程序中包含一个 js 库。目前我使用 includeHTML 将脚本直接包含到 html 代码中。例如

includeHTML('URL.js')

如果我使用 tags$script,例如,当我尝试浏览 js 文件时,浏览器将显示“未找到”

http://127.0.0.1:7106/URL.js

tags$script(src = 'URL.js')

现在我把 URL.js 放在 ui.r 和 server.r 的同一个文件夹中。

我应该在哪里存储 URL.js 文件?或者还有其他方法可以包含js文件吗?

感谢您的任何建议。

5个回答

你需要做的是:

  1. www在与server.R相同的文件夹中创建文件夹ui.R
  2. 将javascript文件放入www文件夹。
  3. 放入tags$head(tags$script(src="hoge.js"))用户界面。

该文件夹看起来像:

├── server.R
├── ui.R
└── www
    └── hoge.js

ui.R是一样的东西

library(shiny)
shinyUI(pageWithSidebar(
  headerPanel("New Application"),
  sidebarPanel(
    sliderInput("obs", 
                "Number of observations:", 
                min = 1, 
                max = 1000, 
                value = 500)
  ),
  mainPanel(
    plotOutput("distPlot"),
    tags$head(tags$script(src="hoge.js"))
  )
))

server.R

library(shiny)
shinyServer(function(input, output) {
  output$distPlot <- renderPlot({
    dist <- rnorm(input$obs)
    hist(dist)
  })
})

请注意,这些是由 Rstudio 生成的模板。

现在head的 html 看起来像:

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  ... snip ...
  <script src="shared/slider/js/jquery.slider.min.js"></script>
  <script src="hoge.js"></script>
</head>
谢谢@kohske。这正是我所需要的。
2021-04-22 03:52:08
是否可以在所有包脚本之前的所有脚本的第一个位置添加脚本?例如,我想制作一个包含多个图层的传单地图,因此我需要在添加<script>L_PREFER_CANVAS = true;</script>之前添加<script src="leaflet.js"></script>但您提供的解决方案在最后添加脚本
2021-04-26 03:52:08
你认为可以将 React 加入到 Shiny 应用程序中吗?
2021-04-30 03:52:08
或者使用includeScriptwhich 接受一个参数path,基本路径是 Shiny 应用程序目录。includeScript但是将内联文件中的 javascript 放置。
2021-05-10 03:52:08

另一种方法是使用:

includeScript("mapManipulator.js"),
 └──shiny
    ├── server.R
    ├── ui.R
    └── www
        ├── stylesheet.css
        └── js
             └── hoge.js

用户界面

它们中的任何一个都可以工作

1. tags$head(HTML("<script type='text/javascript' src='js/hoge.js'></script>"))

2. HTML('<head>
              <link rel="stylesheet" type="text/css" href="stylesheet.css">
              <script type="text/javascript" src="js/hoge.js"></script>
          </head>')

另一个尚未讨论的选项是您只需完全删除 ui.R 文件,然后将整个内容编码为自定义 HTML 文件。详情请见https://shiny.rstudio.com/articles/html-ui.html

在本文中,默认的 HTML 表单元素会自动用作 server.R 中的输入,但您也可以使用本指南https://shiny.rstudio.com/articles/building-构建用于闪亮的自定义输入(或输出)元素输入.html

我的首选方式是这样的:

用户界面:

    extendShinyjs(script = "app.js", functions = c("alerta")),

应用程序.js:

shinyjs.alerta = function(text){
  alert(text);
}

服务器

  js$alerta("alerta alerta antifascista")

您还可以包含这样的代码:

库导入后的 ui.R:

jsCode <- "shinyjs.alerta = function(text){alert(text);}"

ui.R 内流体页面:

extendShinyjs(text = jsCode, functions = c("alerta")),

来自 server.R 的调用将是相同的