☰

Shiny Dashboard - データの初期読み込みが完了するまで、専用の「読み込み中...」ページを表示します。質問する

tag-icon • tag-icon r shiny shinydashboard shinyjs
Shiny Dashboard - データの初期読み込みが完了するまで、専用の「読み込み中...」ページを表示します。質問する

DB からデータを最初に読み込むのにserver.R数秒かかります。これが完了するまで、表示されるページは歪んでいます (選択ボックスのデータが間違っており、ボックスの配置がおかしくなっています。以下を参照してください)。歪んだ表示

データが完全に読み込まれるまで、別のページ (または少なくとも最初に表示されるタブに別のコンテンツ) を表示したいと思います。

専用のグローバル変数 (initial_loading_done) に基づいて何らかのconditionalPanel条件を使用することを考えましたが、どこに置いてもconditionalPanel機能しませんでした。

これが私の UI.R の構造です:

shinyUI(

  dashboardPage(
    dashboardHeader(title = "Title"),
    dashboardSidebar(
       sidebarMenu(
           menuItem("Tab1", tabName = "Tab1",icon = icon("dashboard")),
           menuItem("Tab2", tabName = "Tab2",  icon = icon("bar-chart-o"))
       )
    ),
    dashboardBody(
       includeCSS("custom_css.css"),
       tabItems(
           tabItem(tabName = "Tab1", 
                   fluidRow(<content>),
                   mainPanel(
                      fluidRow(<content>)
                   )
           ),
           tabItem(tabName = "Tab2",
                  fluidRow(<content>),
                  mainPanel(
                      dataTableOutput('my_data_table')  
                  )
           )
       )
    )
 )
)

ベストアンサー1

これは非常に簡単な例です。shinyjsパッケージ

アイデアとしては、読み込み「ページ」とコンテンツ「ページ」を異なるIDで作成し、コンテンツページを最初は非表示にしておき、アプリの準備ができたら使用するshow()というものです。hide()

library(shiny)
library(shinyjs)

load_data <- function() {
  Sys.sleep(2)
  hide("loading_page")
  show("main_content")
}

ui <- fluidPage(
  useShinyjs(),
  div(
    id = "loading_page",
    h1("Loading...")
  ),
  hidden(
    div(
      id = "main_content",
      "Data loaded, content goes here"
    )
  )
)

server <- function(input, output, session) {
  load_data()
}

shinyApp(ui = ui, server = server)

おすすめ記事