R Shiny 应用程序中 ggplotly 图例被裁剪的问题

Question

在我的 Shiny 应用程序中，根据屏幕的大小，我的 ggplotly 交互式绘图的一些图例信息被裁剪。有办法解决这个问题吗？

这是一个小例子：

library(shiny)
library(ggplot2)
library(plotly)
library(tidyverse)


df <- tibble(
  year = rep(c(2015:2023), 8),
  number = c(10:18, 20:12, 13:21, 14:22, 19:11,5:13, 18:10, 8:16),
  region = c(rep("Region 1", 9), rep("Region 2", 9),
             rep("Region 3", 9), rep("Region 4", 9), 
             rep("Region 5", 9), rep("Region 6", 9),
             rep("Region 7", 9), rep("Region 8", 9))
)

# Define UI for application that draws a histogram
ui <- fluidPage(

    # Application title
    titlePanel("Example for StackOverflow"),

    # Sidebar with a slider input for number of bins 
    sidebarLayout(
        sidebarPanel(
            sliderInput("bins",
                        "Number of bins:",
                        min = 1,
                        max = 50,
                        value = 30)
        ),

        # Show a plot of the generated distribution
        mainPanel(
           uiOutput("plotpanel")
        )
    )
)

# Define server logic required to draw a histogram
server <- function(input, output) {
  
  output$plotlyObject <- renderPlotly({
    p <- ggplot(df, aes(x = year, y = number, group = region, color = region)) + 
      geom_line(stat= "identity") 
    ggplotly(p) %>% 
      plotly::layout(
        xaxis = list(
          title = list(text = "Year", font = list(size = 14, family = "Arial black")),
          tickfont = list(family = "Arial black"),
          tickangle = -45
        ),
        yaxis = list(
          title = list(text = 
                         "Number of Patients", font = list(size = 14, family = "Arial black")),
          tickfont = list(family = "Arial black")
        ),
        legend = list(
          orientation = "h",
          y = -.25,
          x = -.1
        ) ) %>% 
      plotly::config(displaylogo = FALSE,
                     modeBarButtonsToRemove = list('hoverClosestCartesian',
                                                   'hoverCompareCartesian',
                                                   'autoScale2d',
                                                   'lasso2d',
                                                   'select2d',
                                                   'zoom2d'
                     ))
  })
  
  output$plotpanel <- renderUI({
    wellPanel(
      plotlyOutput("plotlyObject", height = "400px"),
      style = "padding: 5px; border-color: darkgray"
    )
  })

}

# Run the application 
shinyApp(ui = ui, server = server)

根据浏览器窗口的大小，图例有时会正确显示，但通常不会：

plotly::layout 中是否有可以解决此问题的设置？我还没找到解决办法。

Answer 1

您必须使用layout()函数中的margin参数调整绘图的边距。

library(shiny)
library(ggplot2)
library(plotly)
library(tidyverse)


df <- tibble(
  year = rep(c(2015:2023), 8),
  number = c(10:18, 20:12, 13:21, 14:22, 19:11,5:13, 18:10, 8:16),
  region = c(rep("Region 1", 9), rep("Region 2", 9),
             rep("Region 3", 9), rep("Region 4", 9), 
             rep("Region 5", 9), rep("Region 6", 9),
             rep("Region 7", 9), rep("Region 8", 9))
)

# Define UI for application that draws a histogram
ui <- fluidPage(
  
  # Application title
  titlePanel("Example for StackOverflow"),
  
  # Sidebar with a slider input for number of bins 
  sidebarLayout(
    sidebarPanel(
      sliderInput("bins",
                  "Number of bins:",
                  min = 1,
                  max = 50,
                  value = 30)
    ),
    
    # Show a plot of the generated distribution
    mainPanel(
      uiOutput("plotpanel")
    )
  )
)

# Define server logic required to draw a histogram
server <- function(input, output) {
  
  output$plotlyObject <- renderPlotly({
    p <- ggplot(df, aes(x = year, y = number, group = region, color = region)) + 
      geom_line(stat= "identity") 
    ggplotly(p) %>% 
      plotly::layout(
        xaxis = list(
          title = list(text = "Year", font = list(size = 14, family = "Arial black")),
          tickfont = list(family = "Arial black"),
          tickangle = -45
        ),
        yaxis = list(
          title = list(text = 
                         "Number of Patients", font = list(size = 14, family = "Arial black")),
          tickfont = list(family = "Arial black")
        ),
        legend = list(
          orientation = "h",
          y = -.25,
          x = -.1
        ),
        margin = list(
          l = 100, # adjust the left margin
          r = 100, # adjust the right margin
          t = 50,  # adjust the top margin
          b = 50   # adjust the bottom margin
        )) %>% 
      plotly::config(displaylogo = FALSE,
                     modeBarButtonsToRemove = list('hoverClosestCartesian',
                                                   'hoverCompareCartesian',
                                                   'autoScale2d',
                                                   'lasso2d',
                                                   'select2d',
                                                   'zoom2d'
                     ))
  })
  
  output$plotpanel <- renderUI({
    wellPanel(
      plotlyOutput("plotlyObject", height = "400px"),
      style = "padding: 5px; border-color: darkgray"
    )
  })
  
}

# Run the application 
shinyApp(ui = ui, server = server)