【发布时间】：2021-09-10 16:51:49
【问题描述】：
我一直在尝试使用 HTML 为 Shiny App 构建整个 UI。但是，我遇到了一个问题，如果我想添加可以连接到多个 html 文件的导航栏，它就不起作用了。
我一直关注的参考：https://shiny.rstudio.com/articles/html-ui.html
以下是我的代码：-
我的应用程序.r
# Define server logic for random distribution app ----
server <- function(input, output) {
# Reactive expression to generate the requested distribution ----
# This is called whenever the inputs change. The output functions
# defined below then use the value computed from this expression
d <- reactive({
dist <- switch(input$dist,
norm = rnorm,
unif = runif,
lnorm = rlnorm,
exp = rexp,
rnorm)
dist(input$n)
})
# Generate a plot of the data ----
# Also uses the inputs to build the plot label. Note that the
# dependencies on the inputs and the data reactive expression are
# both tracked, and all expressions are called in the sequence
# implied by the dependency graph.
output$plot <- renderPlot({
dist <- input$dist
n <- input$n
hist(d(),
main = paste("r", dist, "(", n, ")", sep = ""),
col = "#75AADB", border = "white")
})
# Generate a summary of the data ----
output$summary <- renderPrint({
summary(d())
})
# Generate an HTML table view of the head of the data ----
output$table <- renderTable({
head(data.frame(x = d()))
})
}
shinyApp(ui = htmlTemplate("template.html"), server)
我的模板.html
<!DOCTYPE html>
<html>
<head>
<script src="shared/jquery.js" type="text/javascript"></script>
<script src="shared/shiny.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="shared/shiny.css"/>
</head>
<body>
<header>
<!-- A grey horizontal navbar that becomes vertical on small screens -->
<nav class="navbar navbar-expand-sm bg-light">
<!-- Links -->
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="template.html">Link 1</a>
</li>
<li class="nav-item">
<a class="nav-link" href="templatepg2.html">Link 2</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link 3</a>
</li>
</ul>
</nav>
</header>
<h1>HTML UI</h1>
<p>
<label>Distribution type:</label><br />
<select name="dist">
<option value="norm">Normal</option>
<option value="unif">Uniform</option>
<option value="lnorm">Log-normal</option>
<option value="exp">Exponential</option>
</select>
</p>
<p>
<label>Number of observations:</label><br />
<input type="number" name="n" value="500" min="1" max="1000" />
</p>
<h3>Summary of data:</h3>
<pre id="summary" class="shiny-text-output"></pre>
<h3>Plot of data:</h3>
<div id="plot" class="shiny-plot-output"
style="width: 100%; height: 300px"></div>
<h3>Head of data:</h3>
<div id="table" class="shiny-html-output"></div>
</body>
</html>
我的模板pg2.html
<!DOCTYPE html>
<html>
<head>
<script src="shared/jquery.js" type="text/javascript"></script>
<script src="shared/shiny.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="shared/shiny.css"/>
</head>
<body>
<h1>HTML UI Page 2!</h1>
</body>
</html>
我有没有办法将多个 HTML 文件实际连接到单个 Shiny 应用程序？
【问题讨论】：
-
我不太明白：一个html文档一般只有
<!DOCTYPE html>一次，一个<html>块等等。你说的是插入templatepg2.html作为主内的iframe？还是您希望用户能够选择他们想要的模板？ -
我想让用户根据他们选择的标签选择不同的模板。如果他们选择 它将指向 template.html，如果他们选择 它将指向 templatepg2.html/ 这是否回答了您的问题？基本上我需要一个导航栏来链接到单个 Shiny App 的多个 html 文件。
-
您提到了选项卡，但两个模板中都没有定义选项卡集。 “标签”是什么意思？无论如何，您的
<a href=...>Link 1</a>（和Link 2）将离开当前页面，这与模板无关。您所要求的并不是大多数闪亮应用程序的结构，老实说，我有点困惑您预期的用户体验可能是什么。 -
对不起@r2evans，如果我让你更加困惑，让我正确地改写我的句子。我想为我的 Shiny App 创建一个导航栏，并且我使用整个 HTML 文件作为 UI。根据我的理解，为了有一个可以链接到多个页面的导航栏，我需要说明具体的
href= example.html。但是，当我尝试实现这一点时，它不起作用。所以我一直想知道是否有任何解决方案，或者 Shiny 不支持我计划应用的结构。 -
您也可以看到它，因为它与您的多个页面主题相匹配。至少为您提供信息，因为它仍处于试验阶段：colinfay.me/brochure-r-package
标签： javascript html css r shiny