Original


Ukrainian Ports

Source: https://war.ukraine.ua/food-security/ (2023).

Objective

This Visualisation is used in the website war.ukraine.ua. This a website created by the Ukrainian government to provide information about the war in Ukraine. The website includes news articles, infographics, and videos about the war. The visualisation shows the amount of grain exported from Ukraine’s seaports in 2021 which is now threatened by Russian aggression. The infographic shows that the ports of Chornomorsk, Pivdennyi, Mykolaiv, Odesa, and Port of Olvia were the largest exporters of grain in Ukraine. The topic is for the general user and is kept very simple , however the simplicity takes away from the understanding. Here are some technical issues I can see with the visualisation:

The visualisation chosen had the following three main issues:

  • • The size of each visual (sphere) is not relative to the amount distorting the values
  • • The text labels are too small in font making it difficult to read the Port names.
  • • There is no legend to describe what Mt per year represents which does not help with understanding of the volume of the data

These changes would make the visualization more informative and user-friendly.

  1. The Data should follow these standards Clarity: The data should be presented in such a way that it leaves no room for misinterpretation or confusion.

  2. Accuracy: The image should stay truthful to the data it represents, without any distortions or misrepresentations.

  3. Relevance: The visualisation needs to connect with its audience, serving the purpose it was created for and staying aligned with the context.

  4. Efficiency: The viewer should be able to grasp the information quickly, without needing to invest unnecessary effort in understanding the visualisation.

  5. Consistency: The same style, layout, and colour scheme should be maintained throughout the visualisation to ensure a cohesive and harmonious presentation.

This visualisation does not truly represent accuracy because of the distortion of size to value represented. The efficiency and clarity is muted as it is unclear without investigation what Mt represents as a value ( I had to search elsewhere on the page to understand it means Millions of Metric Tonnes) The consistency is lacking as the size of font for ports is small for viewing.

Reference

Code

install.packages("ggplot2")
## package 'ggplot2' successfully unpacked and MD5 sums checked
## 
## The downloaded binary packages are in
##  C:\Users\vidaey9\AppData\Local\Temp\12\RtmpW0VAfi\downloaded_packages
install.packages("RColorBrewer")
## package 'RColorBrewer' successfully unpacked and MD5 sums checked
## 
## The downloaded binary packages are in
##  C:\Users\vidaey9\AppData\Local\Temp\12\RtmpW0VAfi\downloaded_packages
library(ggplot2)
library(RColorBrewer)

# Create a data frame
df <- data.frame(
  Port = c("Chornomorsk", "Pivdennyi", "Mykolaiv", "Odesa", "Other", "Port of Olvia"),
  Amount = c(14.6, 12.9, 9.7, 5.8, 3.59, 2.9)
)

# Create Plot 1 Horizontal Bar Chart
p1<-ggplot(df, aes(x=reorder(Port, Amount), y=Amount, fill=Port)) +
  geom_bar(stat = "identity") +
  coord_flip() +
  scale_fill_brewer(palette="Dark2") +
  geom_text(aes(label=Amount), position=position_dodge(width=0.9), hjust=-0.25) +
  xlab("Port") +
  ylab("Millions of Metric tonnes per year") +
  ggtitle("Yearly Shipping Quantities by Port") +
  theme_minimal() +
  theme(legend.position = "none",
        panel.grid.major = element_blank(),
        panel.grid.minor = element_blank(),
        axis.text.y = element_text(size=14))

#Create Plot 2 Lollipop Chart
p2<-ggplot(df, aes(x=reorder(Port, Amount), y=Amount)) +
  geom_segment(aes(x=Port, xend=Port, y=0, yend=Amount, color=Port), size=1.5) +
  geom_point(aes(color=Port), size=5, alpha=0.7) +
  scale_color_brewer(palette="Dark2") +
  coord_flip() +
  theme_minimal() +
  theme(legend.position = "none",
        panel.grid.major = element_blank(),
        panel.grid.minor = element_blank(),
        axis.text.y = element_text(size = 14)) +
  xlab("Port") +
  ylab("Millions of Metric tonnes per year") +
  ggtitle("Yearly Shipping Quantities by Port")

# install highcharter for interactive visualisation
install.packages("highcharter")
## package 'highcharter' successfully unpacked and MD5 sums checked
## 
## The downloaded binary packages are in
##  C:\Users\vidaey9\AppData\Local\Temp\12\RtmpW0VAfi\downloaded_packages
library(highcharter)
# Use hchart function to create a bar plot
hchart(df, "bar", hcaes(x = reorder(Port, Amount), y = Amount, color = Port)) %>%
  hc_title(text = "Yearly Shipping Quantities by Port", style = list(fontSize = "24px", fontWeight = "bold")) %>%
  hc_xAxis(title = list(text = "Port", style = list(fontSize = "20px", fontWeight = "bold")), labels = list(style = list(fontWeight = "bold")), categories = df$Port) %>%
  hc_yAxis(title = list(text = "Millions of Metric tonnes per year", style = list(fontSize = "20px", fontWeight = "bold")), labels = list(style = list(fontWeight = "bold"))) %>%
  hc_legend(enabled = FALSE)

Data Reference

Reconstruction

The following plots fix the main issues in the original.

  • I Increased the font size of the text labels so that they are easier to read.

  • I Increased the size of font for Port

  • I Includes descriptor showing what Mt means