2017-11-16 9 views
1

ダッシュボードの読み込みページを作成しようとしていますが、動作させることができません。私はここの例に従った。 Shiny Dashboard - display a dedicated "loading.." page until initial loading of the data is doneしかしそれは光沢のあるダッシュボードではなく液状のページのためであり、私はそれをどのように適応させるかを理解できません。シャイニーダッシュボードのページを読み込む

助けていただけたら幸いです!

ローディングページが流動的なページ(ヘッダーやサイドバーなし)になっていて、メインのダッシュボードに光沢のあるダッシュボードがあるようにすることをおすすめします。

追加:GIFを読み込み画面に追加できたら、それは素晴らしいことです。ような何か:

<iframe src="https://giphy.com/embed/BlmF3MhGfa4SY" width="480" height="360" frameBorder="0" class="giphy-embed" allowFullScreen></iframe><p><a href="https://giphy.com/gifs/plane-BlmF3MhGfa4SY">via GIPHY</a></p> 

は、[ブレイク]

library (shiny) 
library (shinydashboard) 
library(shinyjs) 


rm(list=ls()) 

appCSS <- " 
#loading_page { 
    position: absolute; 
    background: #000000; 
    opacity: 0.9; 
    z-index: 100; 
    left: 0; 
    right: 0; 
    height: 100%; 
    text-align: center; 
    color: #FFFFFF; 
} 
" 
header <- dashboardHeader() 
sidebar <- dashboardSidebar() 
body <- dashboardBody("It worked!") 


ui <- dashboardPage(
    useShinyjs(), 
    inlineCSS(appCSS), 
    div(
    id = "loading_page", 
    dashboardHeader(), 
    dashboardSidebar(), 
    dashboardBody("Loading...") 
), 
    hidden(
    div(
     id = "main_content", 
     header, sidebar, body 
    ) 
) 
) 


server = function(input, output, session) { 
    # Simulate work being done for 4 second 
    Sys.sleep(4) 

    hide("loading_page") 
    show("main_content") 
    } 

shinyApp(ui, server) 
+0

このライブラリを試してみてくださいあなたは 'shinycssloaders'ヘルプを使用して、以下の答えをしましたか? – amrrs

答えて

2

shinycssloaders

library(shiny) 
library(shinycssloaders) 
library(highcharter) 

ui <- fluidPage(
     mainPanel(
       plotOutput("my_plot") %>% withSpinner(color="#0dc5c1") 
     ) 
) 

server <- function(input, output){ 

     output$my_plot <- renderPlot({ 
       Sys.sleep(1) 
       plot(mtcars)}) 
} 

shinyApp(ui, server) 
+0

これは、コードの変更をほとんど必要としない優れた雄弁な解決策です!私はそれが( 'withProgress'バーと違って)レンダリング時間を考慮するので、UI側にあることが大好きです。唯一の欠点は、私は複数のプロットを持つ複数のタブを持っているので、ちょうどいい量のコピーと貼り付けが必要です! – Kevin

関連する問題