Контролировать размер popupImage из листовки в виде блеска - PullRequest
0 голосов
/ 28 ноября 2018

У меня возникают трудности с контролем размера изображения, получаемого в результате popupImage (пакет mapview).Ниже приведен воспроизводимый блестящий пример, где у меня есть один маркер с всплывающим окном.Когда я устанавливаю width = 300, всплывающее окно отображается корректно, но я хотел бы отобразить увеличенное изображение.
width = 300

При установке width = 500 всплывающее окно отображается больше, но часть этого выделена серым цветом и добавлена ​​полоса прокрутки.
width = 500 .

Как получить width = 500 для правильного отображения изображения?

Я возился с тэгами css, работал со всем, что мог найти в stackoverflow, и исследовал документы GitHub.

library(shiny)
library(leaflet)
library(dplyr)
library(mapview)

img = "https://cdn.sstatic.net/Sites/stackoverflow/img/error-lolcat-problemz.jpg"

ui <- fluidPage(
  titlePanel("example"),
  sidebarLayout(
    sidebarPanel(width=2),# closes sidebar panel
  mainPanel(
    tags$style(type = "text/css", "#map {height: calc(85vh) !important;}"),
    leafletOutput(outputId = "map") 
))) 

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

output$map <- renderLeaflet({
  leaflet() %>% setView(lng= -96.83875, lat = 29.58518, zoom = 9)%>%
    addProviderTiles("Stamen.Toner") %>%
    addMarkers(lng= -96.83875, lat = 29.58518, popup = popupImage(img, embed= TRUE, width = 300))
  })}  

# Run app ----
shinyApp(ui, server)

1 Ответ

0 голосов
/ 28 ноября 2018

div-обертка, в которой находится всплывающее окно, имеет ширину 301 пикселей по умолчанию, по-видимому.Вы можете изменить это с помощью некоторых CSS.

library(shiny)
library(leaflet)
library(dplyr)
library(mapview)

img = "https://cdn.sstatic.net/Sites/stackoverflow/img/error-lolcat-problemz.jpg"

csscode = HTML("
.leaflet-popup-content {
  width: 500px !important;
}")

ui <- fluidPage(
  titlePanel("example"),
  tags$head(tags$style(csscode)),
  sidebarLayout(
    sidebarPanel(width=2),# closes sidebar panel

    mainPanel(
      tags$style(type = "text/css", "#map {height: calc(85vh) !important;}"),
      leafletOutput(outputId = "map") 
    ))) 

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

  output$map <- renderLeaflet({
    leaflet() %>% setView(lng= -96.83875, lat = 29.58518, zoom = 9)%>%
      addProviderTiles("Stamen.Toner") %>%
      addMarkers(lng= -96.83875, lat = 29.58518,popup=popupImage(img,embed=TRUE,width=500))
  })}  

# Run app ----
shinyApp(ui, server)
...