R shiny 互動模型 crosstalk 套件

主題

R在使用 shiny 套件建立網頁應用程式時, 如果希望二個控制項 (widgets)產生互相聯動效果, 此時可考慮使用 crosstalk 套件[1]. 例如：圖形上選取一個或一個以上之範圍,旁邊自動篩選資料值. 詳細使用方法參考crosstalk官網[2]之說明. 此互動式功能與 plotOutput("plot1", click = "plot_click")[3]功能類似. 本範例說110年2月年粗出生率(%)之互動式繪圖, 資料來源[4].

使用觀念

1. crosstalk 套件使用 R 的API稱為「SharedData R6 class」。
2. 將SharedData物件傳遞給資料框或其他R物件，即可產生互動連結之效果。
3. 支援使用 htmlwidget 套件客製化互動控制項。

關鍵字

#shiny

#crosstalk

#interactive plot

#leaflet

套件

library(readxl)    # read_excel 匯入 Excel 資料檔

library(crosstalk) # SharedData 互相聯動效果

library(leaflet)   # leaflet    互動式地圖

library(DT)        # datatable  互動式表格

library(htmltools) # tags       HTML標籤

執行結果

R程式碼下載

https://github.com/rwepa/DataDemo/blob/master/taiwan_birthd.R

R程式碼

# date     : 2021.03.16

# author   : Ming-Chang Lee

# email    : alan9956@gmail.com

# RWEPA    : http://rwepa.blogspot.tw/

# Encoding : UTF-8

library(readxl)    # read_excel

library(crosstalk) # SharedData

library(leaflet)   # leaflet

library(DT)        # datatable

library(htmltools) # tags

# 匯入資料

# https://github.com/rwepa/DataDemo/blob/master/taiwan_birth.xlsx

birth <- read_excel("taiwan_birth.xlsx")

# 將資料轉換為 SharedData 物件

df <- SharedData$new(birth[c("city", "annua_crude_birth_rate", "longitude", "latitude")])

# 建立標題標題

rr <- tags$div(

  HTML('<a href="http://rwepa.blogspot.com/">110年2月粗出生率%</a>')

)

# 建立2行互相聯動效果

bscols(widths = c(5, 7),

  leaflet(df, height=700) %>% 

    addTiles() %>% 

    addMarkers(popup = ~city) %>% 

    setView(lng = 120.9876, lat = 23.8387, zoom = 7) %>%

    addControl(rr, position = "topright"),

  datatable(df,

            rownames = FALSE,

            colnames = c("地區","110年2月台灣粗出生率%", "經度", "緯度"),

            options = list(pageLength = 10,

                           searching = FALSE),

            height=600)

)

# end

參考資料

1. R CRAN - crosstalk套件: https://cran.r-project.org/web/packages/crosstalk/index.html
2. crosstalk官網: https://rstudio.github.io/crosstalk/index.html
3. plotOutput: https://shiny.rstudio.com/articles/plot-interaction.html
4. 內政部戶政司全球資訊網: https://www.ris.gov.tw/app/portal/346