plotly-ggirafe/app.R at main · MACS40700/plotly-ggirafe · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
library(shiny)
library(plotly)
library(dplyr)
library(bakeoff)

series_colors <- c(
  "1"  = "#fdaba3",  # rose
  "2"  = "#f4b31a",  # garancemarigold
  "3"  = "#fedb11",  # yellow
  "4"  = "#629d62",  # garden
  "5"  = "#84d6d3",  # riptide
  "6"  = "#4254a7",  # cobalt
  "7"  = "#fa7268",  # livingcoral
  "8"  = "#c6b7d5",  # violet
  "9"  = "#4c9a89",  # pine
  "10" = "#ca225e"   # flush
)

# ── Pre-process data ────────────────────────────────────────────────────────
bakers_clean <- bakers |>
  mutate(series = as.character(series))

# Plot 1: Top 10 technical winners
top_star <- bakers_clean |>
  arrange(desc(technical_winner)) |>
  slice_head(n = 10) |>
  mutate(baker_full = reorder(baker_full, technical_winner))

# Plot 3: Occupation counts (top 15 for readability)
occ_data <- bakers_clean |>
  count(occupation, sort = TRUE) |>
  slice_head(n = 15) |>
  mutate(occupation = reorder(occupation, n))

# ── UI ──────────────────────────────────────────────────────────────────────
ui <- fluidPage(

)

# ── Server ──────────────────────────────────────────────────────────────────
server <- function(input, output, session) {

  # ── Plot 1: Star Baker bar chart ──────────────────────────────────────────
  output$plot_star <- renderPlotly({
    plot_ly(
      top_star,
      x = ~technical_winner,
      y = ~baker_full,
      type  = "bar",
      orientation = "h",
      color = ~series,
      colors = series_colors,
      text  = ~paste0("<b>", baker_full, "</b><br>",
                      "Series: ", series, "<br>",
                      "Technical wins: ", technical_winner),
      hoverinfo = "text",
      marker = list(line = list(color = "white", width = 0.8))
    ) |>
      layout(
        xaxis = list(title = "Star Baker Wins", tickfont = list(size = 11)),
        yaxis = list(title = "", tickfont = list(size = 11)),
        legend = list(title = list(text = "<b>Series</b>"),
                      orientation = "v", x = 1.02),
        paper_bgcolor = "#ffffff",
        plot_bgcolor  = "#fafafa",
        margin = list(l = 10, r = 120, t = 10, b = 40),
        bargap = 0.3
      ) |>
      config(displayModeBar = FALSE)
  })

  # ── Plot 2: Technical scatter ─────────────────────────────────────────────
  output$plot_technical <- renderPlotly({
    tech_data <- bakers_clean |>
      filter(!is.na(technical_highest), !is.na(technical_lowest))

    plot_ly(
      tech_data,
      x = ~technical_highest,
      y = ~technical_lowest,
      type = "scatter",
      mode = "markers",
      color = ~series,
      colors = series_colors,
      text  = ~paste0("<b>", baker_full, "</b><br>",
                      "Series: ", series, "<br>",
                      "Best rank: ", technical_highest, "<br>",
                      "Worst rank: ", technical_lowest),
      hoverinfo = "text",
      marker = list(size = 9, opacity = 0.82,
                    line = list(color = "white", width = 0.8))
    ) |>
      layout(
        xaxis = list(title = "Best Technical Rank (lower = better)",
                     tickfont = list(size = 11),
                     autorange = "reversed"),
        yaxis = list(title = "Worst Technical Rank (lower = better)",
                     tickfont = list(size = 11),
                     autorange = "reversed"),
        legend = list(title = list(text = "<b>Series</b>"),
                      orientation = "v", x = 1.02),
        paper_bgcolor = "#ffffff",
        plot_bgcolor  = "#fafafa",
        shapes = list(list(
          type = "line",
          x0 = 1, x1 = 13, y0 = 1, y1 = 13,
          line = list(color = "#ddd", dash = "dot", width = 1.5)
        )),
        margin = list(l = 10, r = 120, t = 10, b = 40)
      ) |>
      config(displayModeBar = FALSE)
  })

  # ── Plot 3: Occupation bar chart ──────────────────────────────────────────
  output$plot_occupation <- renderPlotly({

    occ_colors <- colorRampPalette(c(
      "#fa7268", "#fedb11", "#629d62", "#84d6d3",
      "#4254a7", "#c6b7d5", "#f4b31a", "#4c9a89",
      "#ca225e", "#fdaba3", "#efa5c8", "#b79f26",
      "#ff6d2d", "#1a9a9d", "#8daed7"
    ))(nrow(occ_data))

    plot_ly(
      occ_data,
      x = ~n,
      y = ~occupation,
      type  = "bar",
      orientation = "h",
      marker = list(color = occ_colors,
                    line  = list(color = "white", width = 0.6)),
      text  = ~paste0("<b>", occupation, "</b><br>Bakers: ", n),
      hoverinfo = "text"
    ) |>
      layout(
        xaxis = list(title = "Number of Bakers", tickfont = list(size = 10)),
        yaxis = list(title = "", tickfont = list(size = 10)),
        paper_bgcolor = "#ffffff",
        plot_bgcolor  = "#fafafa",
        margin = list(l = 10, r = 20, t = 10, b = 40),
        bargap = 0.25,
        showlegend = FALSE
      ) |>
      config(displayModeBar = FALSE)
  })
}

shinyApp(ui, server)