首页 > 解决方案 > 如何在 Leaflet 中使用图片作为自定义图标?

问题描述

我正在尝试使用 R 中的传单包创建英国足球场的交互式地图。我知道我可以使用自定义图像作为地图上的图标。对于给定的体育场,我想使用在那里比赛的俱乐部的徽章作为图标。最初,我试图解决一个更简单的问题,即只为所有体育场使用一个自定义图像,希望一旦我能够解决这个问题,我将能够概括并为每个体育场拥有一个自定义图像。出于这个问题的目的,我将提供一个仅包含两个体育场的简化数据集。

到目前为止,我已经尝试使用这张伯恩茅斯徽章的图片(https://upload.wikimedia.org/wikipedia/en/e/e5/AFC_Bournemouth_%282013%29.svg),但是它在运行时没有出现在地图上。我认为 R 无法正确访问此图像,但我不确定它可以访问哪些类型或如何访问它们。

到目前为止,我的代码看起来像这样

library(leaflet)

# Create Data
finalData <-  data.frame(Club = c("A.F.C. Bournemouth", "A.F.C. Wimbledon"), Latitude = c("50.7352","51.4051"), Longitude = c("-1.83839","-0.281984"), stringsAsFactors = FALSE)

# Create map using leaflet
m <- leaflet() %>% 
  addTiles()

# Attempt to create custom icon using the linked picture
BournemouthIcon = makeIcon("https://upload.wikimedia.org/wikipedia/en/e/e5/AFC_Bournemouth_%282013%29.svg", iconWidth = 8, iconHeight = 8)

m %>% addMarkers(lat = as.numeric(finalData$Latitude), 
                 lng = as.numeric(finalData$Longitude), 
                 clusterOptions = markerClusterOptions(), 
                 icon = BournemouthIcon)

我希望看到以伯恩茅斯徽章作为标记在地图上绘制的 2 个体育场,但标记是空白的。1看起来 R 知道在哪里绘制点(因为如果缩小它会检测到点簇),但是它不知道用什么来标记点。2这与我对 R 如何阅读我提供的图片的误解有关。任何有关如何正确构建自定义标记然后将其传递给 addMarkers 的帮助将不胜感激。此外,一些关于将其推广到为每个标记拥有独特的自定义图片的指导也很棒!

标签: rr-leaflet

解决方案


推荐阅读