Question

我想将dygraph的图例放在图表左侧的shiny应用内（dygraph内）。我的问题是我无法设置dygraph的绝对宽度，因为应用程序在不同分辨率的不同屏幕上运行。

代码可能是这样的：

ui.r：

library(dygraphs)
shinyUI(fluidPage(
  titlePanel("Simple example"),
  sidebarLayout(
    sidebarPanel(),
  mainPanel(
    dygraphOutput("dygraph")
  )
 )
))

server.r

library(dygraphs)
shinyServer(function(input, output, session) {
 output$dygraph <- renderDygraph({
  dygraph(discoveries)
 })
})

有没有办法获得width的{{1}}？或者也许是将图例与左侧对齐的更简单的解决方案？

Answer 1

如果要将图例与左上角对齐，则可以使用以下CSS：

.dygraph-legend {
  left: 70px !important;
  background-color: transparent !important;
}

您还可以使用tableHTML::make_css

轻松地将其添加到您的代码中

library(shiny)
library(tableHTML)
library(dygraphs)
ui <- shinyUI(fluidPage(
 tags$style(make_css(list('.dygraph-legend', 
                          c('left', 'background-color'), 
                          c('70px !important', 'transparent !important')))),
 titlePanel("Simple example"),
 sidebarLayout(
  sidebarPanel(),
  mainPanel(
   dygraphOutput("dygraph", width = '80%')
  )
 )
))

server <- shinyServer(function(input, output, session) {
 output$dygraph <- renderDygraph({
  lungDeaths <- cbind(mdeaths, fdeaths)
  dygraph(lungDeaths)
 })
})

shinyApp(ui = ui, server = server)

如果你想要挖掘dygraph容器的宽度，你可以使用dygraphOutput中的参数宽度

Answer 2

这样做的一种方法是使用column并选择1到12之间的宽度。这是ui.R代码，其中2代表图例，10代表dygraph。

library(dygraphs)
shinyUI(fluidPage(
    titlePanel("Simple example"),
    sidebarLayout(
        sidebarPanel(),
        mainPanel(
            column(2,
                h3("My Legend")
            ),
            column(10,
                dygraphOutput("dygraph")
            )
        )
    )
))

dyLegend在一个闪亮的应用程序中左对齐

2 个答案: