rggplot2plotlyggplotly

ggplotly first bar label half hidden in horizontal bar chart

I cannot understand why my ggplot first bar label is half hidden in the horizontal bar chart below.

I don't want to reduce the size of the labels because they would look too small. I tried adding a margin, but to no avail.

Could you please help me with it?

Link to the dataset

# Import dataset
db <- read_excel("dataset.xlsx")
options(scipen = 999)

# Rename variables
colnames(db) <- c("rank",
                  "name",
                  "sport",
                  "totalEarnings",
                  "on-the-field_Earnings",
                  "off-the-field_Earnings")

# Format numbers
custom_number_format <- function(x){ifelse(x > 999999,paste(format(round((x/1000000))),"M"),format(round(x)))}

# Create text column in dataset to display the tooltip
db <- db %>%
  mutate(text = paste(
    "<span style='font-size:14px;'><b>", name, "</b></span><br>",
    "\nOn Field Earnings:", "<b> $", custom_number_format(`on-the-field_Earnings`), "</b>",
    "\nOff Field Earnings:", "<b> $",custom_number_format(`off-the-field_Earnings`), "</b><br>",
    "<span style='font-size:16px;'> \nTotal Earnings:</span>", "<b> $", custom_number_format(totalEarnings), "</b>"))


# Design Bar chart
ggp <- db %>%
  mutate(name = fct_reorder(name, totalEarnings)) %>%
  ggplot(aes(totalEarnings, name, fill = totalEarnings, text = text)) +
  geom_col(width = 0.7, show.legend = FALSE) +
  scale_x_continuous(limits=c(0, 160000000), expand = c(0, 0)) +
  scale_y_discrete(expand = expansion(mult = 0, 0.05)) +
  scale_fill_gradient(high = "#24336a", low = "#2296cf") +
  theme(
    plot.background = element_blank(),
    panel.background = element_blank(),
    axis.title = element_blank(),
    axis.text.x = element_blank(),
    axis.ticks.x = element_blank(),
    axis.ticks.y = element_blank()
  ) +
  geom_text(aes(label = custom_number_format(totalEarnings)), size = 3)

ggp <- ggplotly(ggp, tooltip = "text") %>%
  config(displayModeBar = FALSE)

ggp <- ggp %>%
  layout(
    hoverlabel = list(bgcolor = "white")
  )

ggp$x$data[[44]]$textposition <- "right"
ggp

enter image description here

Solution

  • The issue is the small expansion you have set for the y scale. Increase the expansion and you should be fine, e.g. in the code below I used an additive expansion of 1 on either side of the y scale but it would also be sufficient to increase it only on upper end using e.g. scale_y_discrete(expand = c(0, 0.05, 0, 1)).

    Using some fake example data:

    library(plotly, warn=FALSE)
#> Loading required package: ggplot2
library(forcats)

set.seed(123)

db <- data.frame(
  name = sample(c(LETTERS, letters), 43),
  totalEarnings = seq(1e5, 136e6, length.out = 43)
)

ggp <- db %>%
  mutate(name = fct_reorder(name, totalEarnings)) %>%
  ggplot(aes(totalEarnings, name, fill = totalEarnings)) +
  geom_col(width = 0.7, show.legend = FALSE) +
  scale_x_continuous(limits = c(0, 160000000), expand = c(0, 0)) +
  scale_y_discrete(expand = c(0, 1)) +
  scale_fill_gradient(high = "#24336a", low = "#2296cf") +
  theme(
    plot.background = element_blank(),
    panel.background = element_blank(),
    axis.title = element_blank(),
    axis.text.x = element_blank(),
    axis.ticks.x = element_blank(),
    axis.ticks.y = element_blank()
  ) +
  geom_text(aes(label = custom_number_format(totalEarnings)), size = 3) +
  coord_cartesian(clip = "off")

ggp <- ggplotly(ggp, tooltip = "text") %>%
  config(displayModeBar = FALSE)

ggp <- ggp %>%
  layout(
    hoverlabel = list(bgcolor = "white")
  )

ggp$x$data[[44]]$textposition <- "right"

ggp