You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Shiny框架重置按钮点击后地图未清除的代码修改需求

解决Shiny中Reset按钮清除googleway地图的问题

要实现重置按钮清空地图,同时保证重新选择选项后能正常生成地图,核心是通过响应式变量管理地图状态,在重置时更新为空地图,获取路线时更新为带路线的地图。以下是具体修改方案:

修改关键点

  • 添加reactiveVal存储地图对象,初始化为空白地图
  • 点击Get route时更新响应式变量为生成的路线地图
  • 点击Reset时,除了清空下拉框,同时更新响应式变量为空白地图
  • 地图输出根据响应式变量动态渲染,确保状态同步

修改后的完整代码

library(shiny)
library(shinythemes)
library(lubridate)
library(googleway)

set_key("API KEY")

df1<- structure(
  list(
    Marketname = c("Market1","Market1", "Market2","Market2", "Market3", "Market3", "Market4", "Market4"),
    Latitude = c(-22.900200453490385, -22.900200453490385,-22.89279876292728,-22.89279876292728,-22.89107669207457,-22.89107669207457,-22.91668421655409,-22.91668421655409),
    Longitude = c(-48.448779371935494,-48.448779371935494, -48.45043377250408,-48.45043377250408,-48.44108027972275,-48.44108027972275,-48.43786997555729,-48.43786997555729)),
  row.names = c(NA, 8L), class = "data.frame")

ui <- fluidPage(  
  shiny::navbarPage(theme = shinytheme("flatly"), collapsible = TRUE,
                    br(),
                    tabPanel("Rota",
                             sidebarLayout(
                               sidebarPanel(
                                 selectizeInput("market1", label = h5("Choose starting point:"), choices = NULL, 
                                                multiple = TRUE,
                                                options = list(maxItems = 1)),
                                 
                                 selectizeInput("market2", label = h5("Choose destination point:"), choices = NULL, 
                                                multiple = TRUE,
                                                options = list(maxItems = 1)),
                                 
                                 actionButton(inputId = "getRoute", label = "Get route"),
                                 actionButton(inputId = "reset", label = "Reset")),
                               
                               mainPanel(
                                 tabsetPanel(      
                                   tabPanel("Route",google_mapOutput(outputId = "mapWarsaw"),
                                   )
                                 ))
                             )))

server <- function(input, output,session) {
  
  # 用reactiveVal管理地图状态,初始为空白地图
  map_state <- reactiveVal(google_map())
  
  observe({
    updateSelectizeInput(session, "market1",
                         choices = unique(df1$Marketname)
    )
  })
  
  observe({
    excludeOption <- NULL
    if (!is.null(input$market1)) {
      excludeOption <- input$market1
    }
    
    updateSelectizeInput(session, "market2",
                         choices = unique(df1$Marketname[df1$Marketname != excludeOption])
    )
  })
  
  observeEvent(input$getRoute, {
    origin <- df1[df1$Marketname == input$market1, c("Latitude", "Longitude")][1, ]
    
    destination <- df1[df1$Marketname == input$market2, c("Latitude", "Longitude")][1, ]
    
    route <- google_directions(origin = origin, 
                               destination = destination,
                               mode = "driving")
    
    df_routes <- data.frame(polyline = direction_polyline(route))
    
    df_way <- cbind(
      route$routes$legs[[1]]$end_location,
      data.frame(address = route$routes$legs[[1]]$end_address)
    )
    
    # 更新地图状态为带路线的地图
    m3 <- google_map() %>%
      add_polylines(data = df_routes, polyline = "polyline", stroke_weight = 4)
    map_state(m3)
  })
  
  observeEvent(input$reset, {
    # 清空下拉框(注意用updateSelectizeInput匹配组件类型)
    updateSelectizeInput(session, "market1", selected = "")
    updateSelectizeInput(session, "market2", selected = "")
    # 重置地图状态为空白地图
    map_state(google_map())
  })
  
  # 根据响应式变量渲染地图
  output$mapWarsaw <- renderGoogle_map({
    map_state()
  })
  
}

shinyApp(ui = ui, server = server)

核心说明

  • map_state <- reactiveVal(google_map()):创建响应式变量存储地图,初始是空白的谷歌地图
  • 点击Get route时,生成路线地图后通过map_state(m3)更新状态
  • 点击Reset时,不仅清空下拉选择框,还通过map_state(google_map())将地图重置为空白
  • 地图输出始终依赖map_state(),确保状态变化时自动更新界面

内容的提问来源于stack exchange,提问作者Carlo Soares

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.01 16:37:33