RでHex ~ R + Shinylive + Quarto = 最強 ~

Japan.R 2024のLTで利用したスライドです。
Enjoy!

1. RでHex R + Shinylive + Quarto = 最強 2024/12/07 statditto @Japan.R 2024
2. 自己紹介 • X : @st4tditt0 • B：@statditto • R： ◦ 好きなパッケージ紹介ドラゴン @Tokyo.R 112 ◦ 相関データのサンプルサイズ設計 @Tokyo.R 115
3. Rといえば何角形 ？
4. Rといえば六角形！ (Hex)
5. 六角形といえば？
6. Hex (Board Game)
7. Hex (Board Game) • 二人が交互にコマを置く • 対辺を繋げたら勝ち • Each player placed stones. • They can win connecting their sides.
8. Write with R!
9. How to make Make Board Place stone Check win End • 必要な機能 ◦ 盤面生成 ◦ 石の配置 ◦ 勝利条件チェック • interactiveにやるなら サーバーが必須......？
10. Shinylive • サーバー無しでShinyを利用できる！[1] ◦ WebR君がいい感じにしてくれている • 最近のアップデートでより便利に[2, 3] • Shiny apps without Shiny server. ◦ Recently updated make Shinylive more usefull. Yutaniさんに感謝 🙏
11. 盤面生成 Make board ggplot2::stat_summary_hex() やgeom_hex()で六角形の描写 は可能 密度プロットが簡単に書ける
12. 盤面生成 ggplot(long_board, aes(x = col, y = row, z = player)) + stat_summary_hex( binwidth = c(1, 1), linewidth = 1, colour = "black", fun = function(x) mean(x, na.rm = TRUE) ) + scale_fill_gradient2( low = "white", mid = "#FF0033", high = "#00B900", midpoint = 1, na.value = "grey" ) + coord_fixed() Make board データの持ち方を工夫して ゴリ押し それっぽい
13. 石の配置 ui <- fluidPage( titlePanel("Hex Game"), mainPanel( plotOutput("hex_board", click = "plot_click") ) ... ) server <- function(input, output) { input$plot_click # ここに色々入ってる感じ ... } Place stone Shinyはグラフのclick位置の 座標を簡単に取れる Atusyさん に 感 謝🙏 [4]
14. 勝利条件 dfs <- function(board, player, visited, row, col) { size <- nrow(board) if (visited[row, col] || board[row, col] != player) { return(FALSE) } visited[row, col] <- TRUE neighbors <- get_neighbors(row, col, size) for (neighbor in neighbors) { if (dfs(board, player, visited, neighbor[1], neighbor[2])) { return(TRUE) } } return(FALSE) } Check winner DFS（深さ優先探索）で ゴリ押し 面白味なし！
15. 完成！ • とりあえず動く[5] ◦ Quarto拡張機能[6]が便利 • リファクタリングして R言語 Advent Calendar 2024で 改めて紹介します！
16. Why R?
17. Because it's fun!
18. Enjoy!
19. ref 1. Shinylive 2. WebAssembly roundup part 2: Shinylive 0.8.0 3. shinylive v0.8.0 のリリースノートを眺めてみる（2024/11/26） 4. Shiny でプロットを click したり brush したりした時に得られるデータま とめ 5. https://github.com/statditto/hex_with_shinylive 6. https://github.com/quarto-ext/shinylive