Ggiraph 圖表在 Shiny 上調整太多

Question

我試圖弄清楚如何更好地可視化 Shiny 應用程序上的 ggiraph 圖表。 問題是：圖表在桌面和移動設備上看起來很棒，但在移動設備上它們在下方留下了太多空間。

在桌面上

這是我在手機上看到的：

垂直混亂

這是應用程序的布局：

# Define UI for application
ui <- fixedPage(
  tags$style(HTML("
         body {
        background-color: white;
        color: black;
        font-family: 'Garamond'
      }
      h2 {
        font-family: 'Garamond';
      }
      .shiny-input-container {
        color: #474747;
      }")),
  fluidRow(girafeOutput('ggplot'),
           selectInput(
             inputId = 'Country',
             label = 'Countries and territories',
             choices = c(unique(speed_data$location)),
             multiple = FALSE,
             selected = 'Europe'
             
           )),
  fluidRow(style='height:40vh')
)

# Define server logic required to draw a histogram
server <- function(input, output,session) {
  
  dat = reactive({
    speed_data %>% 
      filter(location == input$Country)
  })
  
  map = reactive({
    subset(world, !(is.na(world$value)))
  })
  
  
  output$ggplot <- renderGirafe({gg = ggplot(dat(), aes(
    x = date, y = value)) + 
    geom_line_interactive(aes(group = location, y = value, tooltip = location, color = location)) +
    scale_y_continuous(labels = scales::comma) +
    scale_color_brewer(palette = 'Set1') + 
    picci + theme(legend.title = element_blank(),
                  axis.text.x = element_text(angle = 90, vjust = 0.5, hjust=1),
                  legend.position = 'none') +
    labs(title = paste("Pandemic's speed |", c(dat()$location)),
         subtitle = 'Daily new cases difference (rolling average, 20 days)',
         caption = 'SOURCE: Our world in data',
         x = '',
         y = '')
  ggiraph(code = print(gg),
          options =  list(
            opts_hover(css = "stroke:#5eba7d88;cursor:pointer;")))
  })
}
# Run the application 
shinyApp(ui = ui, server = server)

Answer 1

這個問題的解決方案是把

girafeOutput('myggiraphplot',height = '75%')

它工作得很好。