从 r shiny 的传单中控制 popupImage 的大小 [英] Control the size of popupImage from leaflet in r shiny
问题描述
我很难控制由 popupImage
(mapview 包)生成的图像的大小.下面是一个可重现的闪亮示例,其中我有一个带有弹出窗口的标记.当我设置 width = 300
时,弹出窗口正确显示,但我想显示更大的图像.
宽度 = 300
I am having difficulties to control the size of the image resulting from popupImage
(mapview package). Below is a reproducible shiny example where I have a single marker with a popup. When I set width = 300
, the popup displays correctly, but I would like to display a bigger image.
width = 300
当设置 width = 500
时,弹出窗口显示更大,但其中一部分显示为灰色并添加了滚动条.
width=500.
When setting width = 500
, the popup displays larger, but a portion of it is greyed out and a scroll bar is added.
width=500.
如何让 width = 500
正确显示图片?
How can I get width = 500
to display the image correctly?
我弄乱了 css 标签,研究了我在 stackoverflow 上可以找到的所有内容,并检查了 GitHub 文档.
I've messed around with css tags, worked through everything I could find on stackoverflow, and examined the GitHub documents.
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)
推荐答案
popup 所在的 div-wrapper 的默认宽度显然是 301px.你可以用一些CSS来改变它.
The div-wrapper where the popup is, has a width of 301px as default apparently. You can change it with some 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)
这篇关于从 r shiny 的传单中控制 popupImage 的大小的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!