Question

如何将图标添加到包Leaflet R中的图层控件？我使用以下代码制作了图标：

rojos <- makeAwesomeIcon(icon='ion-waterdrop', library='ion', markerColor = 'red', iconColor = 'white')
verdes <- makeAwesomeIcon(icon='ion-waterdrop', library='ion', markerColor = 'green', iconColor = 'white')

并使用以下代码制作地图

agua <-leaflet(options = leafletOptions(zoomControl = TRUE,
                                        minZoom = 10, maxZoom = 17,
                                        dragging = TRUE))%>%
  addTiles()%>% 
  setView(-101.145,19.793, 10) %>%
  # MAPAS BASE
  addProviderTiles(providers$OpenStreetMap.BlackAndWhite, group = "Calles") %>%
  addProviderTiles(providers$Esri.WorldImagery, group = "Imagen satelital") %>% 
  ###########################################################################################################
addGeoJSONv2(
  jsonlite::toJSON(rojo),
  markerType="marker",
  markerIcons = rojos,
  popupProperty='popup', 
  labelProperty='NOMBRE DEL CUERPO DE AGUA',
  group = "Agua contaminada") %>%
  addGeoJSONv2(
    jsonlite::toJSON(verde),
    markerType="marker",
    markerIcons = verdes,
    popupProperty='popup', 
    labelProperty='NOMBRE DEL CUERPO DE AGUA',
    group = "Agua no contaminada") %>%
  #POLIGONOS
  addPolygons(data = cuitzeo, col="green",fillColor="Transparent", group = "Cuenca de Cuitzeo",
              weight = 3, opacity = 1)%>%
  addPolygons(data = pol_mor, col="#000000",fillColor="Transparent",  
              group = "Límite Municipal Morelia",
              weight = 2, opacity = 1, fillOpacity = .8) %>%
  # CONTROL DE CAPAS
  addLayersControl(
    baseGroups = c("Calles","Imagen satelital"),
    overlayGroups = c("Agua contaminada","Agua no contaminada","Cuenca de Cuitzeo","Límite Municipal Morelia"),
    options = layersControlOptions(collapsed = F)
  )

结果如下：

我想得到这种风格的东西，但是带着我的图标：

Answer 1

有一种相对简单的方法可以使用r中的传单功能，而不依赖于自定义的javascript控件：在组名中包含html标记。

不是命名一个组：“A组”，而是命名为：

<div style='position: relative; display: inline-block' class='awesome-marker-icon-blue awesome-marker'>
   <i class='glyphicon glyphicon-glass icon-black '></i>
</div>
Group A

例如，您可以根据图标名称以编程方式轻松创建此名称。每个名称中只有少数内容会发生变化：颜色，库（fa，ion，glyphicon），图标类（例如：fa-glass，ion-checkmark，glyphicon-fire）以及显示的组名。

此方法创建一个看起来像你想要的图层控件：

为了简化操作，请将名称存储在命名列表/向量中，并在添加图层时使用该名称定义组，并在定义控件中应包含的组时再次使用它们。这是一个基本的例子：

library(leaflet)

IconSet <- awesomeIconList(
  "Cruise Ship"   = makeAwesomeIcon(icon= 'glass', markerColor = 'blue', iconColor = 'black', library = "glyphicon"),
  "Pirate Ship" = makeAwesomeIcon(icon= 'fire', markerColor = 'black', iconColor = 'white', library = "glyphicon")
)

# Some fake data
df <- sp::SpatialPointsDataFrame(
  cbind(
    (runif(20) - .5) * 10 - 90.620130,  # lng
    (runif(20) - .5) * 3.8 + 25.638077  # lat
  ),
  data.frame(type = factor(
    ifelse(runif(20) > 0.75, "Pirate Ship", "Cruise Ship"),
    c("Cruise Ship", "Pirate Ship")
  ))
)

# group names:
groups <- c("Cruise Ship" <- "<div style='position: relative; display: inline-block' class='awesome-marker-icon-blue awesome-marker'><i class='glyphicon glyphicon-glass icon-black '></i></div>Cruise Ship",
            "Pirate Ship" <- "<div style='position: relative; display: inline-block' class='awesome-marker-icon-black awesome-marker'><i class='glyphicon glyphicon-fire icon-white '></i></div>Pirate Ship")


leaflet(df) %>% addTiles() %>%
  addAwesomeMarkers(icon = ~IconSet[type], group=~groups[type]) %>% 
  addLayersControl(                                                                                                           
    overlayGroups = groups,
    options = layersControlOptions(collapsed = FALSE)
  )

同样，如果处理几个图层或动态图层，创建一个获取图标数据并使相应名称稍后使用的函数应该不会太难，而不是硬编码上面的名称。

无论如何，这应该可以用作在控件中实现图标的方法。

在Leaflet R中向图层控件添加图标

1 个答案: