Shiny：地図上をクリックした後にマウスホイールをズームできるようにする方法はありますか？

Question

マウスホイールのズームを有効にする方法は、地図を最初にクリックした後でなければなりません。

マップをクリックした後に地図をズームしたいと思う次のコードがあります。それを輝かせる方法がありますか？

library(shiny) 
library(leaflet) 
library(maps) 

ui <- fluidPage(
leafletOutput("CountryMap", width = 1000, height = 500) 
) 

server <- function(input, output){ 
    Country = map("world", fill = TRUE, plot = FALSE, regions="USA", exact=TRUE) 
    output$CountryMap <- renderLeaflet({ 
    leaflet(Country) %>% addTiles() %>% 
    fitBounds(Country$range[1], Country$range[3], Country$range[2], Country$range[4])%>% 
    addPolygons(fillOpacity = 0.6, smoothFactor = 0.5, stroke = TRUE, weight = 1) 
}) 
} 

shinyApp(ui =ui, server = server) 

Answer 1

RリーフレットパッケージはzoomControlまたはmouseWheelControlまだこのhttps://github.com/rstudio/leaflet/issues/179に応じて無効にするオプションを持っていますが、リンクからYihuiの提案に触発されていない、ここで動的にマウスのクリックイベントに応じたmaxZoomレベルを変更する回避策があります。

library(shiny) 
library(leaflet) 
library(maps) 

ui <- fluidPage(
    leafletOutput("CountryMap", width = 1000, height = 500) 
) 

server <- function(input, output){ 

    Country = map("world", fill = TRUE, plot = FALSE, regions="USA", exact=TRUE) 

    # Add a default minZoom and maxZoom of the same value so that the map does not zoom 
    output$CountryMap <- renderLeaflet({ 
     leaflet(Country) %>% addTiles(options=tileOptions(minZoom=4, maxZoom=4)) %>% 
      fitBounds(Country$range[1], Country$range[3], Country$range[2], Country$range[4]) %>% 
      addPolygons(fillOpacity = 0.6, smoothFactor = 0.5, stroke = TRUE, weight = 1)    
    }) 

    # Change a reactive value depending on mouse click 
    zoom <- reactiveValues(level=4) 

    # This records mouse clicks outside polygons 
    observeEvent(input$CountryMap_click, { 
     zoom$level = 20 
    }) 

    # This records mouse clicks inside polygons 
    observeEvent(input$CountryMap_shape_click, { 
     zoom$level = 20 
    }) 

    # Change zoom level of the map 
    observe({ 
     if (zoom$level == 20) { 
      leafletProxy("CountryMap") %>% clearTiles() %>% 
       addTiles(options=tileOptions(minZoom=4, maxZoom=20)) 
     } 
    }) 

} 

shinyApp(ui =ui, server = server) 

Answer 2

私は非常にwarmoverflowのアイデアのように、それはR側に純粋であると理解することは非常に簡単以来。私はちょうど彼がすでにあなたの質問に答えているのを見ただけです。しかし、私はすでに別の解決策に取り組んでいたので、ここに投稿しています。複数のオプションを持つことを傷つけません。

リーフレットmapを見つけてscrollWheelZoomプロパティを変更するJavaScriptソリューションを作成しました。これは非常にまっすぐだったでしょう。disableスクロールズームが始まり、enable地図が最初にクリックされるとすぐにスクロールできます。しかし、リーフレットの人は、this fix to another issueで物事をより難しくしました。そこには、他のもののほかに、リスナーが追加されています。enablesは、マウスが移動すると（いつも迷惑になる）スクロールズームします。だから私の修正では、scrollWheelZoomプロパティのdisableへのリスナを追加して（したがって、enableをキャンセルする）リスナをドキュメントに追加するscriptをドキュメントに追加します。最初にmapをクリックすると、このイベントリスナーが削除され、通常（デフォルト）のズームオプションが適用されます。

以下のスクリプトを使用したコード：

library(shiny) 
library(leaflet) 
library(maps) 

ui <- fluidPage(
    leafletOutput("CountryMap", width = 1000, height = 500), 
    tags$script(" 
    $(document).ready(function() {  
     setTimeout(function() { 

     var map = $('#CountryMap').data('leaflet-map');    
     function disableZoom(e) {map.scrollWheelZoom.disable();} 

     $(document).on('mousemove', '*', disableZoom); 

     map.on('click', function() { 
      $(document).off('mousemove', '*', disableZoom); 
      map.scrollWheelZoom.enable(); 
     }); 
     }, 100); 
    }) 
    ") 
) 

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

    Country = map("world", fill = TRUE, plot = FALSE, regions="USA", exact=TRUE) 
    output$CountryMap <- renderLeaflet({ 
    leaflet(Country) %>% addTiles() %>% 
    fitBounds(Country$range[1], Country$range[3], Country$range[2], Country$range[4])%>% 
    addPolygons(fillOpacity = 0.6, smoothFactor = 0.5, stroke = TRUE, weight = 1) 
    }) 
} 

shinyApp(ui =ui, server = server)