I am creating a shiny app with this layout:
There are meant to be 4 cards on the top row, and then two plotly graphs underneath. I would like the cards to appear in boxes like this:
But why is it only showing the text? I am using the bslib library.
The code for the app below is as follows:
library(shiny)
library(plotly)
library(bslib)
library(lorem)
library(ggplot2)
ui <- fluidPage(
titlePanel("Test title"),
sidebarPanel(
width = 2,
h2(""),
dateRangeInput('dateRange_last_week',
label = 'For the time period:',
start = Sys.Date()-365, end = Sys.Date()),
pickerInput(
inputId = "picker_1",
label = "Picker 1",
choices = NULL,
options = list(`actions-box` = TRUE, `live-search` = TRUE),
multiple = TRUE),
pickerInput(
inputId = "picker_2",
label = "Picker 2:",
choices = NULL,
options = list(`actions-box` = TRUE, `live-search` = TRUE),
multiple = TRUE)),
mainPanel(
layout_column_wrap(
heights_equal = "all", full_screen = TRUE, width = 1/4,
card(card_header("A long, scrolling, description"),
card_body(lorem::ipsum(paragraphs = 3, sentences = 5))),
card(card_header("A long, scrolling, description"),
card_body(lorem::ipsum(paragraphs = 3, sentences = 5))),
card(card_header("A long, scrolling, description"),
card_body(lorem::ipsum(paragraphs = 3, sentences = 5))),
card(card_header("A long, scrolling, description"),
card_body(lorem::ipsum(paragraphs = 3, sentences = 5)))
),
fluidRow(
column(6,
plotlyOutput("test_plot_1")),
column(6,
plotlyOutput("test_plot_2")))
)
)
# Define server logic required to draw a histogram
server <- function(input, output, session) {
output$test_plot_1 <- renderPlotly({
fig <- ggplot2::diamonds
fig <- fig %>% count(cut, clarity)
fig <- fig %>% plot_ly(x = ~cut, y = ~n, color = ~clarity)
fig
})
output$test_plot_2 <- renderPlotly({
x= c(1, 2, 3, 5.5, 10)
y= c(10, 8, 6, 4, 2)
width = c(0.8, 0.8, 0.8, 3.5, 4)
data <- data.frame(x, y, width)
fig <- plot_ly(data)
fig <- fig %>% add_bars(
x= ~x,
y= ~y,
width = ~width
)
fig
})
}
# Run the application
shinyApp(ui = ui, server = server)
Thank you!
