Shiny + Leaflet是否可以添加图片到基于组的弹出窗口？

Question

目前，我有一个闪亮的应用程序，它创建了一个物种点的小叶地图。将鼠标悬停在点上时，物种名称将同时显示为标签和弹出窗口。

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")

我已经阅读了如何添加图像到弹出窗口，但这将添加相同的图像到所有弹出窗口。我想要发生的是，一旦点击一个点，弹出一个带有物种名称和图片的弹出窗口(无论是本地文件还是网络链接，以最容易的为准)-这样每个群体(物种)都将有自己的相关图片。

这个是可能的吗？

Answer 1

是的，如果您希望每个组都有自己的图像，您需要创建一个包含图像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'>"
        )
    )

Answer 2

你也可以从这里复制代码：

https://github.com/abenedetti/bioNPS