时间戳

首页 > 解决方案 > 如何根据列宽分配绘图图的宽度？

r - 如何根据列宽分配绘图图的宽度？

问题描述

我在一个闪亮的应用程序上有一个图表。目前，它位于屏幕中间的一个 4 大小的列下。这里的问题是 plotly 元素的固定大小会覆盖列宽，因此当我调整屏幕大小时，图形将保持大小固定。

此外，该图在其下方留下了很多空间（请参见末尾的水平线）。我怎样才能删除那个空间？

在此处输入图像描述

用户界面

      fluidRow(
        #valueBoxOutput("prescripciones_covid"),
        column(4, 
               offset = 4,
               plotlyOutput('plot1')   
      
      )),
          fluidRow(
            hr(style = "border-top: 1px solid #000000;"))

服务器

output$plot1 <- renderPlotly(
    plot1 <- plot_ly( a ,
                      labels = ~DxPpal, 
                      values = ~n,
                      type = 'pie',
                      width = 390,
                      height = 250,
                      #text = ~DxPpal,
                      hovertemplate = "%{label} <br> %{percent}<br> %{value} ") %>%
      layout( title = list  ( text = "Top 10 Diagnosticos"),
              font = list (size = 11) ) %>% 
      layout(legend = list(orientation = 'h')) %>%
      layout(autosize = F,  margin = list(l = 0,
                                          r = 0,
                                          b = 5,
                                          t = 30))  %>%
       layout(showlegend = FALSE)

标签： rplotlyshinydashboard

解决方案

fluidRow(
  #valueBoxOutput("prescripciones_covid"),
  column(4, 
         offset = 4,
         div(plotlyOutput('plot1', width="100%"), align = "center")   
         
  ))

编辑：用户界面示例

tabPanel(
  fluidRow(
    column(width=4, div(valueBoxOutput("first_vb", width = 10), align = "center")),
    column(width=4, div(valueBoxOutput("second_vb", width = 10), align = "center")),
    column(width=4, div(valueBoxOutput("third_vb", width = 10), align = "center"))
  ),
  fluidRow(
    column(width=4, offset = 4, div(valueBoxOutput("fourth_vb", width = 10), align = "center")
  ),
  br(),
  div(plotlyOuput("plot1", width = "50%", height= 450), align = "center"),
  br(),
  hr()
)

推荐阅读