Searching a Leaflet Map?

Viewed 41

I started working with a shapefile in R. In this shapefile, each "boundary" is uniquely defined by a value in "col1" (e.g. ABC111, ABC112 , ABC113, etc.):

library(sf)
library(igraph)


sf <- sf::st_read("C:/Users/me/OneDrive/Documents/shape5/myshp.shp", options = "ENCODING=WINDOWS-1252")

head(sf)

Simple feature collection with 6 features and 3 fields
Geometry type: MULTIPOLYGON
Dimension:     XY
Bounding box:  xmin: 7201955 ymin: 927899.4 xmax: 7484015 ymax: 1191414
Projected CRS: PCS_Lambert_Conformal_Conic

       col1   col2  col3                   geometry
620     ABC111    99 Region1 MULTIPOLYGON (((7473971 119...
621     ABC112    99 Region1 MULTIPOLYGON (((7480277 118...
622     ABC113   99 Region1 MULTIPOLYGON (((7477124 118...
627     ABC114    99 Region1 MULTIPOLYGON (((7471697 118...
638     ABC115   99 Region1 MULTIPOLYGON (((7209908 928...
639     ABC116    99 Region1 MULTIPOLYGON (((7206683 937...

> dim(sf)
[1] 500   4

sf_trans = st_transform(sf, 4326)

I then plotted this data using the leaflet library:

library(leaflet)

map = leaflet(sf_trans) %>% addPolygons( stroke = FALSE) %>% addTiles(group = "OSM") %>%  addProviderTiles("CartoDB.DarkMatter", group = "Carto") %>% addPolygons(data = st_trans, weight=5, col = 'blue') 

What I want to do is to try and make a "searchable" map. For example, imagine that "ABC111" is like an American ZIP Code. I want to make a map in which you can search for "ABC111" and the geographical outline of "ABC111" will be highlighted.

As an example, the ZIP Code of the Space Needle Tower in Seattle, Washington (USA) is "98109". If I search for this ZIP Code on Google Maps, the outline of this ZIP code is highlighted in red:

enter image description here

I was able to find a question on stackoverflow that explains how to add a search bar on a leaflet map for individual points (R leaflet search marker NOT work):

libary(dplyr)
library(leaflet)
library(leaflet.extras)



# using the same reproducible data from the question/example
cities <- read.csv(
    textConnection("City,Lat,Long,Pop
                    Boston,42.3601,-71.0589,645966
                    Hartford,41.7627,-72.6743,125017
                    New York City,40.7127,-74.0059,8406000
                    Philadelphia,39.9500,-75.1667,1553000
                    Pittsburgh,40.4397,-79.9764,305841
                    Providence,41.8236,-71.4222,177994
                    "))


leaflet(cities) %>%
    addProviderTiles(providers$OpenStreetMap) %>%
    
    addResetMapButton() %>%
    # these markers will be "invisible" on the map:
    addMarkers(
        data = cities, lng = ~Long, lat = ~Lat, label = cities$City,
        group = 'cities', # this is the group to use in addSearchFeatures()
        # make custom icon that is so small you can't see it:
        icon = makeIcon( 
            iconUrl = "http://leafletjs.com/examples/custom-icons/leaf-green.png",
            iconWidth = 1, iconHeight = 1
        )
    ) %>%
    addSearchFeatures(
        targetGroups = 'cities', # group should match addMarkers() group
        options = searchFeaturesOptions(
            zoom=12, openPopup = TRUE, firstTipSubmit = TRUE,
            autoCollapse = TRUE, hideMarkerOnCollapse = TRUE
        )
    ) 

enter image description here

But is there a way that the above code can be modified such that when you enter a term in the search bar (e.g. ABC111, ABC112), the entire boundaries of this region are highlighted in red?

Thank you!

0 Answers
Related