我正在尝试将easyPrint plugin合并到我 Shiny 的传单应用程序中。我想要的是看起来像the demo的东西,但是有光泽。

我试图模仿the examples,但是没有成功。

到目前为止,这是我的R代码的代码:

    library(shiny)
    library(shinydashboard)
    library(shinyjs)
    library(htmlwidgets)
    library(htmltools)
    library(leaflet)
    library(leaflet.extras)
    library(sp)

    shinyApp(
  ui = fluidPage(
    leafletOutput("map", height = 750)
  ),
  server = function(input, output) {

    registerPlugin <- function(map, plugin) {
      map$dependencies <- c(map$dependencies, list(plugin))
      map
    }

    easyPrintPlugin <- htmlDependency("leaflet-easyprint", "2.1.8",
                                      src = c(href = "https://github.com/rowanwins/leaflet-easyPrint/blob/gh-pages/dist/"),
                                      script = "index.js")

    # Map
    output$map <- renderLeaflet({
      leaflet() %>%
        addProviderTiles(providers$CartoDB.Positron) %>%
        registerPlugin(easyPrintPlugin) %>%
        onRender("function(el, x) {
                 L.easyPrint({
                 position: 'topleft',
                 sizeModes: ['A4Portrait', 'A4Landscape']
                 }).addTo(map);}")
    })

  }
)

但是,没有任何 react 。从字面上看是白色的屏幕。如果我删除了onRender部分,则传单工作正常。

不幸的是,我对Shiny,leaflet,.js和github还是比较陌生,所以我努力确定是哪个方面导致了问题。

最佳答案

解决方案

  library(leaflet)
  library(shiny)
  library(htmlwidgets)

  jsfile <- "https://rawgit.com/rowanwins/leaflet-easyPrint/gh-pages/dist/bundle.js"
  ui <- fluidPage(
    tags$head(tags$script(src = jsfile)),
    leafletOutput("map")
  )

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

    output$map <- renderLeaflet({
      leaflet() %>%
        addProviderTiles("OpenStreetMap.Mapnik") %>%
        setView(-122.23, 37.75, zoom = 10) %>%
        onRender(
          "function(el, x) {
            L.easyPrint({
              sizeModes: ['Current', 'A4Landscape', 'A4Portrait'],
              filename: 'mymap',
              exportOnly: true,
              hideControlContainer: true
            }).addTo(this);
            }"
        )
      })

    }

  shinyApp(ui, server)
r -  Shiny 的传单easyPrint插件-LMLPHP
注意:leaflet-easyPrint取决于dom-to-image。对于 dom-to-image Readme,不支持Safari和Internet Explorer。但是,“打印”按钮将在Chrome和Firefox中起作用。
故障排除过程
如果运行应用程序并检查元素,则会看到以下错误:
r -  Shiny 的传单easyPrint插件-LMLPHP
让我们从第二个和第三个错误开始。
无法加载资源
此错误是不言自明的:URL https://github.com/rowanwins/leaflet-easyPrint/blob/gh-pages/dist//index.js不存在。路径错误:index.js目录中不存在dist
我们要在以下路径中使用bundle.js:https://github.com/rowanwins/leaflet-easyPrint/blob/gh-pages/dist/bundle.js
未加载脚本
GitHub使用严格的MIME类型检查,因此浏览器未按预期使用文件。我们需要使用rawgit.com路径。阅读更多here。要编写rawgit.com路径,请执行以下步骤(来自链接的答案):

我们应该使用以下路径:https://rawgit.com/rowanwins/leaflet-easyPrint/gh-pages/dist/bundle.js
类型错误:L.easyPrint不是函数
错误是在加载leaflet-easyPrint之前发生的错误。这告诉我们在加载onRender并将其附加到窗口小部件之前已调用leaflet-easyPrint。对于Joe Cheng in this thread,运行时htmldependency注入(inject)可以是异步的。他建议不要将htmlDependency(src = c(href = "http://..."))用于打算与Shiny一起使用的任何依赖项。
相反,我们可以将远程JS文件包含在 header of the app中。然后在调用leaflet-easyPrint之前将加载onRender

关于r - Shiny 的传单easyPrint插件,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/47343316/

10-12 17:30