Следуя указаниям @TimSalabim, я разделил границы и заполнил мои соседние многоугольники, чтобы я мог упорядочить их соответствующим образом с помощью zIndex.
https://lawsblog.netlify.com/post/leaflet-map/
Если я addPolygons(neighbourhood fill)
функцию highlightOptions()
функцию addPolygons(neighbourhood fill)
, я не знаю, как увеличить границу полигона при addPolygons(neighbourhood fill)
мыши.
Если я addPolylines(neighbourhood border)
функцию highlightOptions()
функцию addPolylines(neighbourhood border)
я могу addPolylines(neighbourhood border)
мышь только по границам, а ширина увеличивается. Это поведение, которое я хочу, когда я курсирую над любой частью района.
Теперь, когда я разделял заливку и границы полигонов, как увеличить ширину границы при наведении мыши на область заполнения?
# Add hood borders
addPolylines(data = borders,
color = "white",
opacity = 1,
weight = 2,
options = pathOptions(pane = "hood_borders")) %>%
# Add hood fill
addPolygons(data = hood_shp,
fillColor = ~pal(be_per_cap),
fillOpacity = 1.0,
color = NA,
options = pathOptions(pane = "hoods",
# Highlight neighbourhoods upon mouseover - NOT CORRECT
highlight = highlightOptions(
stroke = 4),
# Add label info when mouseover
label = labels,
labelOptions = labelOptions(
style = list("font-weight" = "normal", padding = "3px 8px"),
textsize = "15px",
direction = "auto")))
Принимая то, что рекомендовал SeGa, я изменил код. См. Здесь. Границы соседства не затенены, и граница расширяется при наведении. Однако граница не возвращается к исходной ширине с помощью мыши. Это почему?
leaflet(options = leafletOptions(minZoom = 11, maxZoom = 16), width = "100%") %>%
addTiles() %>%
# Raster image surrounding Toronto
addProviderTiles(providers$OpenStreetMap.BlackAndWhite) %>%
# Center map north of Toronto City Hall slightly zoomed in
setView(map,
lng = -79.384293,
lat = 43.685, #43.653908,
zoom = 12) %>%
# Vector neighbourhoods
addPolygons(data = hood_shp,
fillColor = ~pal(be_per_cap),
color = NA,
fillOpacity = 1,
# Highlight neighbourhoods upon mouseover
highlight = highlightOptions(
weight = 3,
fillOpacity = 0,
color = "black",
opacity = 1.0,
bringToFront = TRUE,
sendToBack = TRUE),
# # Add label info when mouseover
label = labels,
labelOptions = labelOptions(
style = list("font-weight" = "normal", padding = "3px 8px"),
textsize = "15px",
direction = "auto")) %>%
# Add highways
addPolygons(data = xway,
color = "sienna",
weight = 1.0,
opacity = 1.0,
fillOpacity = 0.7) %>%
# Add major arterial
addPolygons(data = mart,
color = "#737373",
weight = 1.0,
opacity = 1.0,
fillOpacity = 1.0) %>%
# Add parks
addPolygons(data = parks,
color = "green",
weight = 1.0,
opacity = 1.0,
fillOpacity = 1.0,
options = pathOptions(clickable = FALSE)) %>%
# Add border
addPolylines(data = hood_shp,
color = "black",
stroke = TRUE,
opacity = 1,
weight = 1) %>%
# Add legend
addLegend(data = hood_shp,
colors =c("#AA122E", "#F4AE7E", "#FEFDB7"),
labels= c("More", "", "Less"),
opacity = 1.0,
title = "B&Es",
position = "bottomright")