Where Have I Been?

By Balint Mazzag in Maps Shiny Travel

December 23, 2022

A Shiny application which maps out the countries where I have travelled so far, and how I rank them.


Since I was very young, I kept track of everything, related to geography, or countries in general. I always enjoyed looking at maps and visualising travel between them. In the past 23 years, I had the opportunity to travel to many of them, and I rank them based on my personal preference.


The embedded Shiny application deployed to visualize the tiers of countries As the datatable is not dynamically sizeable, it may appear way larger on your device then it should on the original app

Disclaimer

The tier list was assembled based on preference of the country’s weather, cleanliness, cost of living and other important factors that was considered during either vacation or living in a certain location.

Build-up of the application

Step 1 - Creating the data for ranking and visualising

Although, I usually read in Excel files with the readxl package, in the blog, I will initialise my raw dataframe from the GitHub repo of the project.

  • data is the initial raw dataframe
  • data_geom includes the shapefile of the countries
  • factpal is the coloring palette that I will use for the different Tiers
#readxl::read_xlsx("/data/country_year_tier.xlsx") #Works for local projects

load(url("https://github.com/mbalint9901/wherehaveibeen/blob/main/data/data_render.RData?raw=true"))
ls()
## [1] "data"      "data_geom" "factpal"

In these dataframes, I already set up the Tier list and also the shapefiles for plotting them later on. As it is a Shiny application, there are two files that go hand-in-hand separately:

  • ui.R which handles the user interface and the reactive operations
  • server.R that handles recalculation and rendering of the plot

Here, I can only show you the static version of the map, however it is the basic logic behind the application

For maps in Shiny I usually opt for the nicer leaflet package, which renders layers on top of each other:

  1. First, the addProviderTiles renders the background map
  2. Then, the addPolygons feature adds the shapefile layers from the dataframe to the leaflet map
  3. We can tailor the formatting of the polygons to our needs and desires, with highlightOptions and the popup labels and markers

I just tried out how to insert flag images into the popup labels, through URLs pointing to an online resource of images of flags. Although it takes a little more time to load the images, it is easily implmeneted in any other project without having to download a whole package of SVG images

To make it interactive, and to mimic the behaviour of the application, we can create a filter for the year I travelled to a destination.

first_visit_var <- 2022

data_geom %>%
  st_as_sf() %>% 
  filter(first_visit <= first_visit_var) %>%
  leaflet() %>%
  setView(lng = -50, lat = 30, zoom = 2) %>%
  # addTiles() %>%
  addProviderTiles(providers$CartoDB.PositronNoLabels) %>%
  addPolygons(color = ~factpal(tier), weight = 1,
              layerId = data$country_code,
              smoothFactor = 0.5, fillOpacity = 0.8,
              opacity = 1,
              highlightOptions = highlightOptions(color = "white", weight = 2,
                                                  bringToFront = TRUE),
              popup= ~paste0(
                '<strong>', country ,
                '</strong><br/>Tier:', tier,
                '<br/>First visited:', first_visit,
                '<br/><a href = "https://www.wikipedia.org/wiki/',
                country,
                '"> Wikipedia link </a>'),
              label =
                ~paste0(
                  "<img src='",image_link,"' height='24px'>",
                  "&nbsp;&nbsp;&nbsp;&nbsp;<strong>", country, "</strong><br/>Click for more info!"
                ) %>% lapply(htmltools::HTML))

And voilá, my own travel diary is starting to take shape, but for interactivity, check my code on Github

Posted on:
December 23, 2022
Length:
4 minute read, 701 words
Categories:
Maps Shiny Travel
Tags:
hugo-site
See Also:
A Spoonful of Hugo
A third post
A second post