web-dev-qa-db-ja.com

光沢のあるトップナビゲーション(navbarPage)とサイドバーメニュー(sidebarMenu)を組み合わせる方法

多くのタブがある光沢のあるアプリ(navbarPageを使用)があり、どのタブが選択されていても表示されるsidebarMenuを追加したいと思います。サイドバーの入力値は、すべてのタブのコンテンツに影響を与えます。さらに、光沢のあるダッシュボードにあるため、sidebarMenuを非表示にできるはずです。

私は2つの可能な方法を見ます:

(A)shinydashboardを使用し、どういうわけか上部のナビゲーションバーを追加するか

(B)navbarPageを使用し、どういうわけか非表示にできるサイドバーメニューを追加します。

(A)shinydashboardを使用すると、私が欲しいものに最も近いのはこれです(簡略化されたMWE):

library("shiny")
library("shinydashboard")

cases <- list(A=seq(50,500, length.out=10), B=seq(1000,10000, length.out=10))

ui <- dashboardPage(
  dashboardHeader(title = "dash w/ navbarMenu"),
  dashboardSidebar(selectizeInput('case', 'Pick a case', selected="A", choices = c("A", "B"), multiple = FALSE), numericInput('num', 'Number', min = 1, max = 10, value = 1, step = 1)),
  dashboardBody(
    tabsetPanel(
      tabPanel(h4("Perspective 1"),
               tabsetPanel(
                 tabPanel("Subtab 1.1", plotOutput("plot11")),
                 tabPanel("Subtab 1.2")
               )),
      tabPanel(h4("Perspective 2"),
               tabsetPanel(
                 tabPanel("Subtab 2.1"),
                 tabPanel("Subtab 2.2")
               ))
    )
  )
)

server <- function(input, output) {
  output$plot11 <- renderPlot({
    hist(rnorm(cases[[input$case]][input$num]))
  })
}

shinyApp(ui, server)

ナビゲーションバーのメニューはメニューの一部ではないタブセットであるため、これは醜いです。私が欲しいのは: dashboard_w_navbar

これに基づくと post 、トップメニューに「Perspective1」タブと「Perspective2」タブを含めることはまったく不可能だと思います。したがって、shinydashboardを使用することは現実的ではないようです。

(B)navbarPageを使用して、navlistPanel()を使用しようとしましたが、成功しませんでした

(1)sidebarMenuのように動作するようにします。つまり、ページの左側に全体的に表示され、

(2)非表示機能を追加します。これが私の試みです:

library("shiny")

cases <- list(A=seq(50,500, length.out=10),
              B=seq(1000,10000, length.out=10))

ui <- navbarPage(title = "nav w/ sidebarMenu",
                   tabPanel(h4("Perspective 1"),
                            tabsetPanel(
                              tabPanel("Subtab 1.1",
                                       plotOutput("plot11")),
                              tabPanel("Subtab 1.2")
                            )),
                   tabPanel(h4("Perspective 2"),
                            tabsetPanel(
                              tabPanel("Subtab 2.1"),
                              tabPanel("Subtab 2.2")
                            )),

                 navlistPanel(widths = c(2, 2), "SidebarMenu",
                              tabPanel(selectizeInput('case', 'Pick a case', selected="A", choices = c("A", "B"), multiple = FALSE)),
                              tabPanel(numericInput('num', 'Number', min = 1, max = 10, value = 1, step = 1))
                 )
)


server <- function(input, output) {
  output$plot11 <- renderPlot({
    hist(rnorm(cases[[input$case]][input$num]))
  })
}

shinyApp(ui, server)

繰り返しますが、私が欲しいのは: nav_w_sidebar

私は知っています、 flexDashboard があります。それは3つの理由で問題を解決しません:

(1)サイドバーメニューは列であり、実際のサイドバーメニューではないため、非表示にすることはできないと思います。

(2)アプリで必要な反応性がない、

(3)dataTablesが機能しないと思います。これも必要です。

その上、コードをRmarkdown構文に変更する必要がないことを望んでいます。

私のアプリはすでにnavbarPageを使用して構築されているため、できれば、navbarPageを使用してsidebarMenuを追加します。

9
jmjr

これを実現するためのより簡単でエレガントな方法があります。

shinydashboardPlus

および ここ 実際の動作を確認します。

0
jmjr

sidebarLayoutを使用して、次のようにすることができます。

ui <- fluidPage(sidebarLayout(
  sidebarPanel(navlistPanel(
    widths = c(12, 12), "SidebarMenu",
    tabPanel(selectizeInput('case', 'Pick a case', selected="A", choices = c("A", "B"), multiple = FALSE)),
    tabPanel(numericInput('num', 'Number', min = 1, max = 10, value = 1, step = 1))
  )),
      mainPanel(navbarPage(title = "nav w/ sidebarMenu",

                            tabPanel(h4("Perspective 1"),
                                     tabsetPanel(
                                       tabPanel("Subtab 1.1",
                                                plotOutput("plot11")),
                                       tabPanel("Subtab 1.2")
                                     )),
                            tabPanel(h4("Perspective 2"),
                                     tabsetPanel(
                                       tabPanel("Subtab 2.1"),
                                       tabPanel("Subtab 2.2")
                                     )))

      )
    ))

あなたはこのようなものを手に入れます: enter image description here

別のオプションは、fluidRow関数を使用することです。このようなもの:

  ui <- fluidPage(
    fluidRow(
      column(3, navlistPanel(
        widths = c(12, 12), "SidebarMenu",
        tabPanel(selectizeInput('case', 'Pick a case', selected="A", choices = c("A", "B"), multiple = FALSE)),
        tabPanel(numericInput('num', 'Number', min = 1, max = 10, value = 1, step = 1))
      )),
      column(9,  navbarPage(title = "nav w/ sidebarMenu",

                             tabPanel(h4("Perspective 1"),
                                      tabsetPanel(
                                        tabPanel("Subtab 1.1",
                                                 plotOutput("plot11")),
                                        tabPanel("Subtab 1.2")
                                      )),
                             tabPanel(h4("Perspective 2"),
                                      tabsetPanel(
                                        tabPanel("Subtab 2.1"),
                                        tabPanel("Subtab 2.2")
                                      ))))


    )
      )

これを取得するには: enter image description here

それが役に立てば幸い!

4
SBista