Question

在solution实现高级闪亮弹出K. Rohde时，我遇到了使用navbarPage和tabPanels的问题。根据链接的解决方案，以下代码位于相应的tabPanel：

中

tabPanel("Multiple Locations",
  uiOutput("script"),
  tags$div(id="garbage"),
  ...rest of UI...
)

如果Multiple Locations是唯一的tabPanel，或者设置了navbarPage(selected="Multiple Locations")，那么一切都运行得非常好（我已经实现了几乎与链接解决方案中的示例相同）。但是如果设置了navbarPage(selected="someOtherPanel")，并且用户随后导航到Multiple Locations tabPanel，则弹出窗口显示为空。

我已经尝试将uiOutput("script")和tags$div(id="garbage")行移动到另一个tabPanel（启动时活动的那个），我尝试在navbarPage下移动它（在任何tabPanel元素之前），我也试过在那些地方复制它，但无济于事。在navbarMenu（）下面移动它会在菜单本身插入一个div。这是有效的设置：

ui<-navbarPage(id="page", selected="Multiple Locations",
  tags$head(tags$link(href="myfavicon.ico", rel="icon"),
            includeCSS("www/style.css"),
            tags$script(type="text/javascript", src = "baranim.js")
            ),
  navbarMenu("Explorer",
    tabPanel("Single Location",
      ...UI elements...
    ),
    tabPanel("Multiple Locations",
        uiOutput("script"),
        tags$div(id="garbage"),
        ...UI elements...
    )
  )
)

虽然该应用尚未完成，但我认为我不会让用户从Multiple Locations tabPanel开始。但显然，我仍然希望弹出窗口能够正常运行。

非常感谢K. Rohde original solution。

Answer 1

首先，我非常感谢你喜欢我的帖子。这非常令人鼓舞。

所以我试图重建你的情况并设法重现你解释的行为。我的侦探工作显示，您在leaflet标签中有另一个Single Locations。那是对的吗？您链接的解决方案仅适用于单个leaflet。它解决了类div的{{1}}，但是如果有多个，则只有第一个被渲染的对象将被处理。这解释了开头选项卡选择的行为。

我修改了脚本，以便解决所有可用的leaflet-popup-pane：

leaflet-popup-panes

这应该可以解决问题。

关于展示位置的一些建议：垃圾 - output$script <- renderUI({ tags$script(HTML(' var observer = new MutationObserver(function(mutations) { mutations.forEach(function(mutation) { if(mutation.addedNodes.length > 0){ Shiny.bindAll(".leaflet-popup-content"); }; if(mutation.removedNodes.length > 0){ var popupNode = mutation.removedNodes[0].childNodes[1].childNodes[0].childNodes[0]; var garbageCan = document.getElementById("garbage"); garbageCan.appendChild(popupNode); Shiny.unbindAll("#garbage"); garbageCan.innerHTML = ""; }; }); }); $(".leaflet-popup-pane").each(function() { observer.observe(this, {childList: true}); }); ')) })只能放置一次，以避免重复的Id问题。但它可以放在ui的任何地方。如果您有多个带有展开式弹出窗口的div，请在每个leaflets下面放置一个script输出（如果在同一页面上有多个，则放在最后一个下方）。特别是使用tabPanels时，这可确保在leaflets执行时已完全呈现script。

请评论，如果这不能解决您的问题或者我错过了什么。

问：K. Rohde的闪亮小册子弹出窗口：如何确保弹出窗口正确显示而不管初始tabPanel？

1 个答案: