Question

我想使用Shiny Leaflet渲染已经存在的传单地图，但是问题出现了，因为初始地图是从外部托管（相当复杂）的JS文件创建的，我没有任何控制权。

我似乎无法将传单映射与R Leaflet函数一起使用。也就是说，除了浏览器控制台打印之外没有任何反应：＆＃34;无法找到带有id mapid＆＃34;的地图。

所以问题是： 如何让Shiny Leaflet识别从外部托管的JS文件在UI端创建的Leaflet地图，以便可以从服务器端更改地图。

下面是一个最小的例子，其中使用JS在UI端创建传单地图。该应用程序然后（失败）尝试从服务器端向地图添加新点。：

library(shiny)
library(leaflet)

ui <- fluidPage(
  # Load leaflet.js
  tags$head(HTML("

                 <link rel='stylesheet' href='https://unpkg.com/leaflet@1.2.0/dist/leaflet.css' integrity='sha512-M2wvCLH6DSRazYeZRIm1JnYyh22purTM+FDB5CsyxtQJYeKq83arPe5wgbNmcFXGqiSH2XR8dT/fJISVA1r/zQ==' crossorigin=''>
                 <script src='https://unpkg.com/leaflet@1.2.0/dist/leaflet.js' integrity='sha512-lInM/apFSqyy1o6s89K4iQUKg6ppXEgsVxT35HbzUupEVRh2Eu9Wdl4tHj7dZO0s1uvplcYGmt3498TtHq+log==' crossorigin=''></script> ")
  ),

  # Setup Map Container
  leafletOutput("mapid", height = "400px"),

  # Setup Base Map
  HTML(
    "
    <script>
    var mymap = L.map('mapid').setView([51.505, -0.09], 13);

    L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
    maxZoom: 18,
    id: 'mapbox.streets'
    }).addTo(mymap);

    L.marker([51.5, -0.09]).addTo(mymap)
    .bindPopup('<b>Hello world!</b><br />I am a popup.').openPopup();
    </script>
    "
  ),

  br(),
  actionButton("recalc", "New points")
)


server <- function(input, output, session) {
  # Create Random Data Point
  points <- eventReactive(input$recalc, {
    cbind(rnorm(40) * 2 + 13, rnorm(40) + 48)
  }, ignoreNULL = FALSE)

  # When recalc is clicked add markers to map
  observeEvent(input$recalc,{
    leafletProxy("mapid", session) %>%
      addMarkers(data = points())
  })
}

shinyApp(ui, server)

任何帮助将不胜感激！

干杯

Make Shiny Leaflet识别从外部托管的JS文件创建的地图

0 个答案: