是否可以根据组向弹出窗口添加图像?

问题描述 投票:0回答:2

目前,我有一个闪亮的应用程序,可以创建物种点的传单地图。当您将鼠标悬停在某个点上时,物种名称会显示为标签和弹出窗口。

leafletProxy("map", data = filteredData()) %>%
  clearMarkers() %>%
  addCircleMarkers(popup = ~as.character(species),
                   label = ~as.character(species), 
                   radius = 6,
                   stroke = TRUE,
                   weight = 1,
                   fillOpacity = 5,
                   fillColor = ~pal(species),
                   color = "black")

我已经阅读了如何向弹出窗口添加图像,但这会将相同的图像添加到所有弹出窗口。我希望发生的是,一旦单击一个点,就会出现一个弹出窗口,其中包含物种名称和图片(本地文件或网络链接,以最简单的为准)-以便每个组(物种)都有自己的相关图片。

这可能吗?

r shiny r-leaflet
2个回答
3
投票

是的,如果您希望每个组都有自己的图像,您需要创建一个新列,其中包含图像的 URL。重要的部分是在弹出窗口中使用 HTML

img
标签。

请参阅下面的演示。

data <- data.frame(
    lng = c(-1,0,1,2),
    lat = c(-1,0,1,2),
    label = c("p1","p2","p3","p4"),
    # some random images I picked up from google images
    # it can be both local or remote
    image_link = c(
        "https://jessehouwing.net/content/images/size/w2000/2018/07/stackoverflow-1.png",
        "https://store-images.s-microsoft.com/image/apps.18496.14408192455588579.aafb3426-654c-4eb2-b7f4-43639bdd3d75.2c522ca4-9686-4ee2-a4ac-cdbfaf92c618?mode=scale&q=90&h=1080&w=1920",
        "https://mk0jobadderjftub56m0.kinstacdn.com/wp-content/uploads/stackoverflow.com-300.jpg",
        # row number 4 use the same link as row number 1
        "https://mk0jobadderjftub56m0.kinstacdn.com/wp-content/uploads/stackoverflow.com-300.jpg"
    )
)


library(leaflet)

leaflet(data = data) %>%
    addTiles() %>%
    addCircleMarkers(
        lng = ~lng,
        lat = ~lat,
        popup = ~paste0(
            "<img src='",image_link,"' width='50px' height='50px'>"
        )
    )



1
投票

您还可以从这里复制代码:

https://github.com/abenedetti/bioNPS

© www.soinside.com 2019 - 2024. All rights reserved.