Using reactable in #TidyTuesday CHAT dataset - World Energy Production
By Jesús Vélez Santiago in R dataviz
July 23, 2022
The data this week comes from data.nber.org.
This data is released under CCBY 4.0, please reference the CHAT dataset via: 10.3386/w15319.
Per the working paper:
We present data on the global diffusion of technologies over time, updating and adding to Comin and Mestieri’s ‘CHAT’ database. We analyze usage primarily based on per capita measures and divide technologies into the two broad categories of production and consumption. We conclude that there has been strong convergence in use of consumption technologies with somewhat slower and more partial convergence in production technologies. This reflects considerably stronger global convergence in quality of life than in income, but we note that universal convergence in use of production technologies is not required for income convergence (only that countries are approaching the technology frontier in the goods and services that they produce).
Libraries
library(tidyverse)
library(reactable)
library(reactablefmtr)
library(tidytuesdayR)
library(htmltools)
library(htmlwidgets)
library(countrycode)
library(dataui)
Load data
tuesdata <- tidytuesdayR::tt_load('2022-07-19')
technology <- tuesdata$technology
Data preparation
General processing
technology_processed <- technology |>
filter(
group == "Production",
category == "Energy",
variable != "electric_gen_capacity"
) |>
mutate(
value = ifelse(
test = variable == "elec_cons",
yes = value / 1e9,
no = value
),
is_source_energy = str_detect(
string = label,
pattern = "Electricity from"
),
is_energy_statistic = !is_source_energy,
label = label |>
str_remove(pattern = "Electricity from ") |>
str_remove(" \\(TWH\\)") |>
str_to_title()
) |>
left_join(
y = codelist |>
select(
continent,
country_name = country.name.en,
iso3c,
flag = unicode.symbol
),
by = "iso3c"
) |>
mutate(
country_name = paste(flag, country_name)
) |>
select(
country_name,
continent,
year,
label,
variable,
value,
is_source_energy,
is_energy_statistic
) |>
arrange(
continent,
country_name,
variable,
label,
year
)
technology_processed
## # A tibble: 58,976 × 8
## country_name continent year label variable value is_source_energy
## <chr> <chr> <dbl> <chr> <chr> <dbl> <lgl>
## 1 🇦🇴 Angola Africa 2000 Coal elec_coal 0 TRUE
## 2 🇦🇴 Angola Africa 2001 Coal elec_coal 0 TRUE
## 3 🇦🇴 Angola Africa 2002 Coal elec_coal 0 TRUE
## 4 🇦🇴 Angola Africa 2003 Coal elec_coal 0 TRUE
## 5 🇦🇴 Angola Africa 2004 Coal elec_coal 0 TRUE
## 6 🇦🇴 Angola Africa 2005 Coal elec_coal 0 TRUE
## 7 🇦🇴 Angola Africa 2006 Coal elec_coal 0 TRUE
## 8 🇦🇴 Angola Africa 2007 Coal elec_coal 0 TRUE
## 9 🇦🇴 Angola Africa 2008 Coal elec_coal 0 TRUE
## 10 🇦🇴 Angola Africa 2009 Coal elec_coal 0 TRUE
## # … with 58,966 more rows, and 1 more variable: is_energy_statistic <lgl>
Prepare overall values and list of trends
technology_processed_summarized <- technology_processed |>
group_by(
continent,
country_name,
variable,
label
) |>
summarize(
overall_value = sum(value),
trend_values = list(value),
is_energy_statistic = first(is_energy_statistic),
is_source_energy = first(is_source_energy),
.groups = "drop"
)
technology_processed_summarized
## # A tibble: 2,016 × 8
## continent country_name variable label overall_value trend_values
## <chr> <chr> <chr> <chr> <dbl> <list>
## 1 Africa 🇦🇴 Angola elec_coal Coal 0 <dbl [20]>
## 2 Africa 🇦🇴 Angola elec_cons Electric … 54.3 <dbl [44]>
## 3 Africa 🇦🇴 Angola elec_gas Gas 19.9 <dbl [20]>
## 4 Africa 🇦🇴 Angola elec_hydro Hydro 77.4 <dbl [20]>
## 5 Africa 🇦🇴 Angola elec_nuc Nuclear 0 <dbl [20]>
## 6 Africa 🇦🇴 Angola elec_oil Oil 16.7 <dbl [20]>
## 7 Africa 🇦🇴 Angola elec_renew_other Other Ren… 0.886 <dbl [20]>
## 8 Africa 🇦🇴 Angola elec_solar Solar 0.157 <dbl [20]>
## 9 Africa 🇦🇴 Angola elec_wind Wind 0 <dbl [20]>
## 10 Africa 🇦🇴 Angola elecprod Gross Out… 155. <dbl [85]>
## # … with 2,006 more rows, and 2 more variables: is_energy_statistic <lgl>,
## # is_source_energy <lgl>
Top energy producers
top_energy_producers <- technology_processed_summarized |>
filter(is_energy_statistic) |>
pivot_wider(
id_cols = c(continent, country_name),
names_from = variable,
values_from = overall_value
) |>
drop_na() |>
slice_max(
elecprod,
n = 50
)
top_energy_producers
## # A tibble: 50 × 4
## continent country_name elec_cons elecprod
## <chr> <chr> <dbl> <dbl>
## 1 Americas 🇺🇸 United States 146903. 187739.
## 2 Asia 🇨🇳 China 60290. 105179.
## 3 Europe 🇷🇺 Russia 21097. 61266.
## 4 Asia 🇯🇵 Japan 37901. 45909.
## 5 Europe 🇩🇪 Germany 24227. 28546.
## 6 Americas 🇨🇦 Canada 20517. 28502.
## 7 Asia 🇮🇳 India 14786. 25932.
## 8 Europe 🇫🇷 France 16681. 23549.
## 9 Europe 🇬🇧 United Kingdom 15721. 19685.
## 10 Americas 🇧🇷 Brazil 11272. 16005.
## # … with 40 more rows
Global trends
global_trends <- technology_processed_summarized |>
filter(
country_name %in% top_energy_producers$country_name,
is_energy_statistic
) |>
pivot_wider(
id_cols = c(country_name, continent),
names_from = variable,
values_from = trend_values
) |>
inner_join(
y = top_energy_producers |>
select(
country_name,
overall_consumption = elec_cons,
overall_production = elecprod
),
by = "country_name"
) |>
arrange(desc(overall_production)) |>
select(
country_name,
continent,
overall_production,
overall_consumption,
production_trends = elecprod,
consumption_trends = elec_cons
)
global_trends
## # A tibble: 50 × 6
## country_name continent overall_product… overall_consump… production_tren…
## <chr> <chr> <dbl> <dbl> <list>
## 1 🇺🇸 United States Americas 187739. 146903. <dbl [105]>
## 2 🇨🇳 China Asia 105179. 60290. <dbl [104]>
## 3 🇷🇺 Russia Europe 61266. 21097. <dbl [98]>
## 4 🇯🇵 Japan Asia 45909. 37901. <dbl [114]>
## 5 🇩🇪 Germany Europe 28546. 24227. <dbl [118]>
## 6 🇨🇦 Canada Americas 28502. 20517. <dbl [102]>
## 7 🇮🇳 India Asia 25932. 14786. <dbl [82]>
## 8 🇫🇷 France Europe 23549. 16681. <dbl [120]>
## 9 🇬🇧 United Kingdom Europe 19685. 15721. <dbl [125]>
## 10 🇧🇷 Brazil Americas 16005. 11272. <dbl [93]>
## # … with 40 more rows, and 1 more variable: consumption_trends <list>
Specific trends
specific_trends <- technology_processed_summarized |>
filter(
country_name %in% top_energy_producers$country_name,
is_source_energy
) |>
mutate(
energy_source_color = case_when(
label %in% c("Coal", "Gas", "Nuclear", "Oil") ~ "#BB86FC",
TRUE ~ "#19ffb6"
)
) |>
arrange(desc(overall_value)) |>
select(
country_name,
energy_source = label,
overall_value,
trend_values,
energy_source_color
)
specific_trends
## # A tibble: 400 × 5
## country_name energy_source overall_value trend_values energy_source_color
## <chr> <chr> <dbl> <list> <chr>
## 1 🇨🇳 China Coal 71812. <dbl [36]> #BB86FC
## 2 🇺🇸 United States Coal 61129. <dbl [36]> #BB86FC
## 3 🇺🇸 United States Gas 28412. <dbl [36]> #BB86FC
## 4 🇺🇸 United States Nuclear 25810. <dbl [36]> #BB86FC
## 5 🇨🇳 China Hydro 17547. <dbl [36]> #19ffb6
## 6 🇮🇳 India Coal 16959. <dbl [36]> #BB86FC
## 7 🇷🇺 Russia Gas 15802. <dbl [36]> #BB86FC
## 8 🇫🇷 France Nuclear 13903. <dbl [36]> #BB86FC
## 9 🇨🇦 Canada Hydro 12479. <dbl [36]> #19ffb6
## 10 🇧🇷 Brazil Hydro 10993. <dbl [36]> #19ffb6
## # … with 390 more rows
Technology adoption in the world’s energy production
Set global table appearance variables
background_color <- "#121212"
border_color <- "#3D3D3D"
text_color <- "white"
font_family <- "Atkinson Hyperlegible"
production_color <- "#4DA1A9"
consumption_color <- "#ffa630"
reactable_theme <- reactableTheme(
style = list(fontFamily = font_family),
searchInputStyle = list(background = background_color),
pageButtonStyle = list(fontSize = 14),
backgroundColor = background_color,
color = text_color,
footerStyle = list(color = text_color, fontSize = 11),
borderColor = border_color,
borderWidth = 0.019
)
Create table
energy_production_table <- global_trends |>
reactable(
theme = reactable_theme,
columns = list(
country_name = colDef(
name = "Country"
),
continent = colDef(
name = "Continent"
),
overall_production = colDef(
name = "Overall production",
cell = data_bars(
data = select(global_trends, overall_production),
round_edges = TRUE,
text_position = "above",
fill_color = production_color,
bar_height = 12,
text_color = text_color,
number_fmt = scales::label_number(big.mark = ",")
)
),
overall_consumption = colDef(
name = "Overall consumption",
cell = data_bars(
data = select(global_trends, overall_consumption),
round_edges = TRUE,
text_position = "above",
fill_color = consumption_color,
bar_height = 12,
text_color = text_color,
number_fmt = scales::label_number(big.mark = ",")
)
),
production_trends = colDef(
name = "Production trends",
cell = react_sparkline(
data = select(global_trends, production_trends),
line_color = production_color,
show_area = TRUE
)
),
consumption_trends = colDef(
name = "Consumption trends",
cell = react_sparkline(
data = select(global_trends, consumption_trends),
line_color = consumption_color,
show_area = TRUE
)
)
),
showSortable = TRUE,
showSortIcon = TRUE,
defaultPageSize = 10,
details = function(index) {
current_country <- global_trends$country_name[index]
current_country_table <- specific_trends |>
filter(country_name == current_country) |>
arrange(desc(overall_value))
current_country_table |>
reactable(
theme = reactable_theme,
columns = list(
country_name = colDef(
show = FALSE
),
energy_source = colDef(
name = "Technology used",
vAlign = "center",
headerVAlign = "center",
align = "right",
cell = pill_buttons(
data = current_country_table,
color_ref = "energy_source_color"
)
),
overall_value = colDef(
name = "Overall value",
cell = data_bars(
data = current_country_table,
round_edges = TRUE,
background = "transparent",
text_position = "outside-end",
text_color = text_color,
fill_gradient = FALSE,
fill_color_ref = "energy_source_color",
number_fmt = scales::label_number(big.mark = ","),
bar_height = 10
)
),
trend_values = colDef(
name = "Production trend",
cell = react_sparkbar(
data = current_country_table,
fill_color_ref = "energy_source_color"
)
),
energy_source_color = colDef(
show = FALSE
)
),
showSortable = TRUE,
showSortIcon = TRUE,
)
}
) |>
google_font(
font_family = font_family
)
text_annotation <- HTML("
<div style='vertical-align:middle;text-align:center;background-color:#121212;color:white;padding-top:25px;padding-bottom:4px;font-size:24px;'>
TECHNOLOGY ADOPTION IN THE WORLD'S ENERGY PRODUCTION
</div>
<div style='vertical-align:middle;text-align:center;background-color:#121212;color:#BBBBBB;padding-top:5px;padding-bottom:5px;font-size:20px;'>
Is your country <span style='color: #4DA1A9'>producing</span> more
<span style='color: #19ffb6'>renewable energy</span> than
<span style='color: #BB86FC'>non-renewable energy</span>?
</div>
<div style='vertical-align:middle;text-align:center;background-color:#121212;color:#BBBBBB;padding-top:5px;padding-bottom:20px;font-size:16px;'>
Data shown on Terawatt-hour (TWh)
</div>
<div style='vertical-align:middle;text-align:center;background-color:#121212;color:#BBBBBB;padding-top:5px;padding-bottom:15px;font-size:14px;'>
Source: data.nber.org | Table: @jvelezmagic
</div>
")
energy_production_table_annotaded <- energy_production_table |>
prependContent(
text_annotation
)
energy_production_table_annotaded
TECHNOLOGY ADOPTION IN THE WORLD'S ENERGY PRODUCTION
Is your country producing more
renewable energy than
non-renewable energy?
Data shown on Terawatt-hour (TWh)
Source: data.nber.org | Table: @jvelezmagic