You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Shiny问题:Box尺寸变化时Plotly图表无法自适应调整

问题:Plotly图表在Shiny动态Box中无法自适应宽度变化

我在Shiny中实现了服务器端动态UI,可通过开关选择显示图表、表格或两者;Box宽度会根据显示数量自动切换为12(单显示)或6(双显示),这部分功能正常。但Plotly图表无法随Box尺寸变化调整宽度,始终保留初始加载时的宽度:

  • 若初始仅启用图表Box(宽度12),添加表格后图表Box变为宽度6,图表仍保持原宽度并超出Box覆盖表格;
  • 若初始启用表格,后续切换为仅显示图表Box,图表仅占Box一半宽度。

我不想在开关状态变化时强制重绘图表(这种方式繁琐且会降低应用性能),请问如何让Plotly图表正确自适应Box尺寸变化?

动态UI组件代码

make_boxes <- reactive({
        
        if(input$chart_toggle & !input$table_toggle) {
        
            fluidRow(box(title = "Chart",
                         width = 12,
                         collapsible = F,
                         collapsed = F,
                         plotlyOutput("plotly_plot")
            ))
        } else if(input$table_toggle & !input$chart_toggle) {
                fluidRow(box(title = "Table",
                             width = 12,
                             collapsible = F,
                             collapsed = F,
                             DTOutput("table")
                ))
        } else if(input$table_toggle & input$chart_toggle) {
                fluidRow(
                    box(title = "Chart",
                        width = 6,
                        collapsible = F,
                        collapsed = F,
                        plotlyOutput("plotly_plot")
                    ),
                    box(title = "Table",
                        width = 6,
                        collapsible = F,
                        collapsed = F,
                        DTOutput("table")
                    )
                )
            }
    })
    
    output$ui_boxes <- renderUI({
        make_boxes()
    })

图表渲染代码

output$plotly_plot <- renderPlotly({
  p1 <- filt_pw() %>%
    ggplot(aes(x = num, y = max_limit,  fill = type)) +
    geom_col(position = position_dodge2(preserve = "single"))
  
  
  ggplotly(p1) %>% 
    layout(autosize = T)
})

主UI部分代码

library(shinydashboard)

dashboardPage(
  dashboardSidebar(
    
    
    h2("Filters"),
    switchInput(
      label = "Chart",
      inputId = "chart_toggle",
      value = FALSE
    ),
    switchInput(
      label = "Table",
      inputId = "table_toggle",
      value = FALSE
    )
  ),
  
  dashboardBody(
    uiOutput("ui_boxes")
  )
)

内容的提问来源于Stack Exchange,提问作者jzadra

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.15 12:16:01