R Markdown and Leaflet

Hossam Saad

July 19, 2020

Introduction

Leaflet is one of the most popular Javascript libraries for creating interactive maps. The leaflet R package allows you to create your own leaflet maps without needing to know any Javascript!

Install Require package

install.packages("leaflet")

My First Map

The leaflet()is used for creating a map widget and we can update on ot later.

library(leaflet)

## Warning: package 'leaflet' was built under R version 3.6.3

MyFisrtMap <- leaflet() %>% 
  addTiles()
MyFisrtMap

Ading Markers

We can add markers by using the addMakers() func and select the ongitude and latitude.

library(leaflet)
MyFisrtMap <- MyFisrtMap %>%
  addMarkers(lat=45.2980803, lng=-76.5898801, 
             popup="Jeff Leek's Office")
MyFisrtMap

Adding More Markers

set.seed(2020-07-19)
MyFisrtMap <- data.frame(lat = runif(20, min = 39.2, max = 39.3),
                 lng = runif(20, min = -76.6, max = -76.5))
MyFisrtMap %>% 
  leaflet() %>%
  addTiles() %>%
  addMarkers()

Making Custom Markers

Instead of using blue markers that's not discripe what we are mapping , so we can use .png files.

Icon <- makeIcon(
  iconUrl = "http://brand.jhu.edu/content/uploads/2014/06/university.shield.small_.blue_.png",
  iconWidth = 38*215/230, iconHeight = 39,
  iconAnchorX = 31*215/230/2, iconAnchorY = 16
)

LocationMapping <- data.frame(
  lat = c(39.2973166, 39.3288851, 39.2906617),
  lng = c(-76.5929798, -76.6206598, -76.5469683))

LocationMapping %>% 
  leaflet() %>%
  addTiles() %>%
  addMarkers(icon = Icon)

Adding More Popups

With adding more markers ,we need to adding popups for each of these popup

Sites <- c(
  "<a href='http://www.jhsph.edu/'>East Baltimore Campus</a>",
  "<a href='https://apply.jhu.edu/visit/homewood/'>Homewood Campus</a>",
  "<a href='http://www.hopkinsmedicine.org/johns_hopkins_bayview/'>Bayview Medical Center</a>",
  "<a href='http://www.peabody.jhu.edu/'>Peabody Institute</a>",
  "<a href='http://carey.jhu.edu/'>Carey Business School</a>"
)

LocationMapping %>% 
  leaflet() %>%
  addTiles() %>%
  addMarkers(icon = Icon, popup = Sites)

Mapping Clusters

Sometimes you might have so many points on a map that it doesn’t make sense to plot every marker. In these situations leaflet allows you to plot clusters of markers using addMarkers(clusterOptions = markerClusterOptions()). When you zoom in to each cluster, the clusters will separate until you can see the individual markers.

MyFisrtMap <- data.frame(lat = runif(500, min = 39.25, max = 39.35),
                 lng = runif(500, min = -76.65, max = -76.55))
MyFisrtMap %>% 
  leaflet() %>%
  addTiles() %>%
  addMarkers(clusterOptions = markerClusterOptions())

Adding Circles

We can draw shapes like circles on maps to identify each loacation that belongs to each others.

NumOfCities <- data.frame(name = c("Baltimore", "Frederick", "Rockville", "Gaithersburg", 
                                 "Bowie", "Hagerstown", "Annapolis", "College Park", "Salisbury", "Laurel"),
                        pop = c(619493, 66169, 62334, 61045, 55232,
                                39890, 38880, 30587, 30484, 25346),
                        lat = c(39.2920592, 39.4143921, 39.0840, 39.1434, 39.0068, 39.6418, 38.9784, 38.9897, 38.3607, 39.0993),
                        lng = c(-76.6077852, -77.4204875, -77.1528, -77.2014, -76.7791, -77.7200, -76.4922, -76.9378, -75.5994, -76.8483))
NumOfCities %>%
  leaflet() %>%
  addTiles() %>%
  addCircles(weight = 1, radius = sqrt(NumOfCities$pop) * 30)

## Assuming "lng" and "lat" are longitude and latitude, respectively

adding Legends

we use legends to identify each markers on map.

MyFisrtMap <- data.frame(lat = runif(20, min = 39.25, max = 39.35),
                 lng = runif(20, min = -76.65, max = -76.55),
                 col = sample(c("yellow", "black", "blue"), 20, replace = TRUE),
                 stringsAsFactors = FALSE)

MyFisrtMap %>%
  leaflet() %>%
  addTiles() %>%
  addCircleMarkers(color = MyFisrtMap$col) %>%
  addLegend(labels = LETTERS[1:3], colors = c("yellow", "black", "blue"))

## Assuming "lng" and "lat" are longitude and latitude, respectively