javascript - 使用 ShinyJS 初始化隐藏元素

Question

我想在 Shiny 的应用程序启动时隐藏一个元素，但与 this example 不同，要隐藏的元素是可见的较大元素的一部分。

在此示例中，要在开始时隐藏的元素是绘图控件，它是传单 map 的一部分。有一个按钮可以切换绘图控件的可见性 - 如何在隐藏绘图控件的情况下启动它？该应用程序的完整代码如下。

library(rbgm)
library(leaflet)
library(shiny)
library(shinyjs)

ui <- fluidPage(
  useShinyjs(),
  leafletOutput("mymap"),
  actionBttn("toggle_button", "Toggle drawing")
)

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

  output$mymap <- renderLeaflet({
    set.seed(2)
    fs <- sample(bgmfiles::bgmfiles(), 1)

    model <- boxSpatial(bgmfile(fs))
    model <- spTransform(model, "+init=epsg:4326")

    m <- leaflet() %>% addTiles() 

    m <- m %>% addPolygons(data = model, group = 'model') %>%     
      addDrawToolbar(targetGroup = 'model',
                     editOptions = editToolbarOptions(
                       selectedPathOptions = selectedPathOptions()))
    m
  })

  observe({
    shinyjs::hide(selector = "div.leaflet-draw") # <---- this doesn't hide the draw controls at the start!!
  })

  observeEvent(input$toggle_button, {
    shinyjs::toggle(selector = "div.leaflet-draw")
  })

}

shinyApp(ui, server)

我尝试使用 observe 在开始时隐藏元素，但它没有执行任何操作，大概是因为绘图控制元素在观察事件触发后加载。

Answer 1

你可以做到

shinyjs::delay(0, shinyjs::hide(selector = "div.leaflet-draw"))

(没有观察者)。

<小时/>

编辑

另一个解决方案:

js <- "
$(document).on('shiny:value', function(e){
  if(e.name === 'mymap'){
    setTimeout(function(){$('div.leaflet-draw').hide();}, 0);
  }
});
"

ui <- fluidPage(
  useShinyjs(),
  tags$head(tags$script(js)),
  leafletOutput("mymap"),
  ...