Shiny Leaflet 使用鼠标点击事件隐藏条件面板

Question

我想使用条件面板在绝对面板中创建一个图，该图仅在我在底图上单击鼠标时出现。这没有问题，我已经做到了。

但是我希望一旦用户划掉该点弹出窗口，该情节就会清除，并且 conditionalPanel 再次折叠。目前，当执行另一次单击时，绘图会更改并重新绘制数据，但我希望将弹出窗口的清除与条件面板的折叠相关联；

这个非常简单的例子显示了点击时创建条件面板（完整版本创建一个点并读取光栅堆栈以绘制时间线）：

ui <- bootstrapPage(
  tags$style(type = "text/css", "html, body {width:100%;height:100%}"),
  leafletOutput("map", width="100%", height="100%"),
  absolutePanel(class = "panel panel-default", fixed = TRUE,draggable = TRUE,
                top = 20, left = 60,

                conditionalPanel("input.map_click",
                   h4(textOutput("Click_text")),
                top=20, left=60, height=400, width=200,
                style="padding-left: 10px; padding-right: 8px; padding-top: 8px; padding-bottom: 8px")
  )
)


server <- function(input, output, session) {

  output$map <- renderLeaflet({
    leaflet() %>%
      setView(-4,52.5,9) %>%
      addProviderTiles(providers$CartoDB.Positron)  
  })

  observeEvent(input$map_click, {
    click <- input$map_click
    text<-paste("Lattitude ", click$lat, "Longtitude ", click$lng)
    text2 <- paste("YOUVE CLICKED THE MAP!!!",click$lat, click$lng)

    proxy <- leafletProxy("map")
    proxy %>% clearPopups() %>%
      addPopups(click$lng, click$lat, text)

    output$Click_text<-renderText({text2})
  })

}

runApp(shinyApp(ui, server), launch.browser = TRUE)

文档中有一个建议是有一个名为 mouseout 的事件，但它可能只是链接到实际标记上的点击，而不是 maptile 点击，因为我当然无法让它工作。有什么办法可以让面板在弹出弹出窗口后消失？

Answer 1

似乎确实该popup_close事件仍未在leafletR中实现。

尽管如此，我们可以使用 awesomehtmlwidgets包来构建它。

library(htmlwidgets)

我们将使用一些javascript来：

• 收听popupclose&popupopen事件。
• 发送事件发生的信息Shiny。

这一切都可以在onRender()函数内部完成：

output$map <- renderLeaflet({
        leaflet() %>%
            setView(-4,52.5,9) %>%
            addProviderTiles(providers$CartoDB.Positron) %>% 

            onRender("
                     function(el, x) {
                         this.on('popupopen', function(e) {
                             Shiny.onInputChange('myEvent', 'open');
                         });

                         this.on('popupclose', function(e) {
                             Shiny.onInputChange('myEvent', 'close');
                         });
                     }")
    })

onRender()添加一些要在渲染地图后执行的 javascript 代码。
在这种情况下，this.on('popupopen', function())创建事件侦听器，同时Shiny.onInputChange('myEvent', 'close')将值分配close给 input$myEvent。

我们现在只需要更改面板的条件：

 conditionalPanel("input.myEvent == 'open'", ...)