闪亮应用的导航栏干扰 rmarkdown 网页的导航栏答案

【问题标题】：navbar of shiny app interferes with navbar of rmarkdown webpage闪亮应用的导航栏干扰 rmarkdown 网页的导航栏
【发布时间】：2019-03-16 23:28:58
【问题描述】：

我正在为我的实验室创建一个网页，在我们拥有的产品中开发的是一个闪亮的应用程序来检查全球气候变化。

这是该页面中的website，这就是应用程序的外观standalone，正如您在菜单中看到的那样，网站中没有显示三个选项，在介绍选项卡中， Intro、Workflow、About 和 Changelog 应该是可见的

网站yaml

我用经典的rmarkdown建站做了一个网页，所以我的网页yaml是这样的：

name: "Sitio web de ecoinformática del laboratorio Marquet"
navbar:
  title: "Ecoinformática"
  left:
    - text: "Home"
      href: index.html
    - text: "Sobre nosotros"
      href: about.html
    - text: "GCM compareR app"
      href: GCMcompareR.html
    - text: Docencia
      icon: fa-gear
      menu:
      - text: Ecología BIO231c 
      - text: Modulo 1.1
        href: Modulo1.1.html
      - text: Modulo 1.2
        href: Modulo1.2.html
    - text: RPackages
      icon: fa-gear
      menu:
      - text: RPackages
      - text: NetworkExtinction
        href: VignetteNetworkExt.html
output_dir: "."
output:
  html_document:
    theme: cosmo
    highlight: textmate
    include:
    css: styles.css

实际应用 Rmd

在 GCM compareR 应用程序的选项卡中，我有以下内容：

---
title: ""
output: html_document
---

```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = TRUE) 
```

<iframe src="http://admin.ecoinformatica.net/shiny/rstudio/sample-apps/GCM/"style="border: 0; position:absolute; top:0; left:0; right:0; bottom:0; width:100%; height:100%"">

可能有效但想不通的解决方案

在顶部添加一个填充以防止两个导航栏产生冲突
在我进入应用网页时，移除网站的导航栏
使de网站的导航栏“可部署”，这样只有当我将光标移动到网页边缘时它才会出现
将网页的导航栏向左更改。

我尝试过的：

改变边框：

<iframe src="http://admin.ecoinformatica.net/shiny/rstudio/sample-apps/GCM/"style="border: 100; position:absolute; top:100; left:0; right:0; bottom:0; width:100%; height:100%"">

让应用响应式

<div class="resp-container">
    <iframe class="resp-iframe" src="http://admin.ecoinformatica.net/shiny/rstudio/sample-apps/GCM/" style="border: 100; position:absolute; top:100; left:0; right:0; bottom:0; width:100%; height:100%"">

使用 include_app

```{r}
knitr::include_app("http://admin.ecoinformatica.net/shiny/rstudio/sample-apps/GCM/", height = "600px")
```

哪种有效，但我无法修复宽度

欢迎任何帮助

【问题讨论】：

我在其中任何一个链接上都看不到这些选项。我可以看到两个选项的最底部。
您可以轻松地填充闪亮的导航栏，使其悬挂得足够低，以便在网站导航栏下方完全可见。这是简单的解决方案，更难但更有趣的解决方案是光标触发的导航栏。
考虑到我看不到任何一个页面上的选项，我猜你可以，这可能是浏览器/监视器相关的问题，这意味着光标激活的导航栏将是一个更强大的解决方案。跨度>
我对@Chabo 这么认为，有什么想法吗？
最好的办法是使用来自 shinyjs 函数的toggle。见这里deanattali.com/2015/04/23/shinyjs-r-package

标签： html r iframe shiny r-markdown

【解决方案1】：

通过调整 iframe 的高度和顶部选项，可以将闪亮的应用导航栏向下移动几个像素：

<iframe src="http://admin.ecoinformatica.net/shiny/rstudio/sample-apps/GCM/"style="border: 0; position:absolute; top:5%; left:0; right:0; bottom:0; width:100%; height:95%"">
</iframe>

【讨论】：