Question

我正在以故事板格式构建R FlexDashboard。我想在一些故事板页面上显示多个图表，包括一系列使用串扰的链接图。但是，当我尝试在页面上显示多个绘图或使用bscols（）函数时，页面看起来都搞砸了。 R FlexDashboard的故事板格式是否允许多个绘图？这是一个例子：

---
title: "Error_example"
output: 
  flexdashboard::flex_dashboard:
    storyboard: true
    theme: bootstrap
---

###Example: Why can't won't the datatable show up below the plot in this storyboard?

```{r}
library(plotly)
library(DT)

plot1<-plot_ly(data=diamonds,x=~carat,y=~price)
table1<-datatable(diamonds)

plot1
table1

Answer 1

bsCols()似乎完全覆盖了flexdashboard CSS，所以我会避免使用它。

一个简单的解决方案是将一些div添加到R块中。类似的东西：

---
title: "I think this should work"
output: 
  flexdashboard::flex_dashboard:
    storyboard: true
    theme: bootstrap
---

###Example: Using divs to separate outputs

```{r}
library(shiny)
library(plotly)
library(DT)

plot1<-plot_ly(data=diamonds,x=~carat,y=~price)
table1<-datatable(diamonds)

 tags$div(
   tags$div(
    plot1
  ),
  tags$div(
    table1
  )
 )
```

Answer 2

这个例子以一种允许大量情节的方式结合了串扰，传单和情节。诀窍是使用带可折叠按钮的absolutepanels。 absolutepanel位于传单地图上，这意味着地图可以像superzip https://shiny.rstudio.com/gallery/superzip-example.html一样全尺寸，而按钮允许绘图根据需要显示。因此，您可以添加尽可能多的图表和表格，将它们与串扰相关联，并且仍然可以讲述您的故事。

这样就形成了一个干净的界面，其中包含了一个用户可以更好地控制最终显示的方式。另一个例子是How to combine row and column layout in flexdashboard?，但没有串扰。

    ---
    title: "Demo"
    output:
      flexdashboard::flex_dashboard:
        orientation: columns
        vertical_layout: fill
    ---


    ```{r setup, include=FALSE}
    library(flexdashboard)
    library(rmarkdown)
    library(plotly)
    library(shiny)
    library(DT)

    ```


    ```{r}
    library(crosstalk)
    sd <- SharedData$new(quakes[sample(nrow(quakes), 100),])

    ```


    Map { data-icon="fa-map-o"}
    =====================================  
    Sidebar {.sidebar data-width=220}
    --------------------------------

    ```{r, results='asis'}

     filter_slider("mag", "Magnitude", sd, column=~mag, step=0.1, width=200)

    ```

    Column {data-width=400}
    --------------------------------


    ### Planet Earth

    ```{r}

    library(leaflet)
     leaflet(sd) %>% addTiles() %>% addMarkers()

    ```



    ```{r}
    ##########################
    absolutePanel(id = "controls", class = "panel panel-default", fixed = TRUE,
                  draggable = TRUE, top = 70, left = "auto", right = 20, bottom = "auto",
                  width = '25%', height = 'auto', 
                  style = "overflow-y:scroll; max-height: 1000px; opacity: 0.9; style = z-index: 400",

                h4(strong("Plot Explorer")),

        HTML('<button data-toggle="collapse" data-target="#box1" class="btn-block btn-primary">dot plot</button>'),
        tags$div(id = 'box1', class="collapse in",

         plot_ly(sd, x = ~depth, y = ~mag) %>% layout(height=200)

                ),

     HTML('<button data-toggle="collapse" data-target="#box2" class="btn-block btn-warning">histogram</button>'),
        tags$div(id = 'box2', class="collapse",

           plot_ly(sd, x = ~depth, y = ~mag, type = "histogram", name = "Histogram") %>% layout(height=200)
        ),

      HTML('<button data-toggle="collapse" data-target="#box3" class="btn-block btn-danger">table</button>'),
        tags$div(id = 'box3', class="collapse in",

     datatable(sd, extensions="Scroller", style="bootstrap", class="compact", width="100%",height = 300,
        options=list(deferRender=TRUE, scrollY=300, scroller=TRUE))
       )

      )

    ```

如果使用故事板布局，如何在R flexdashboard页面上显示多个图

2 个答案: