6

这是嵌入在我的网站中的应用程序。我想摆脱我的应用程序下方的滚动小部件，这是由于 tabsetPanel 的宽度。

我使用以下代码嵌入应用程序：

<iframe width="800" height="480" frameborder="0" src="http://spark.rstudio.com/alstated/meanvar/"></iframe>

应用代码：

用户界面

library(shiny)

# Define UI for application that plots random distributions 
shinyUI(pageWithSidebar(
  headerPanel(title = ""),
  sidebarPanel(
    sliderInput("size",
                "Number of Observations",
                min = 10,
                max = 200,
                value = 95),

    sliderInput("mu",
                "Mean",
                min = -100, 
                max = 100,
                value = 0),

    sliderInput("sd",
                "Standard Deviation",
                min = 1,
                max = 6,
                value = 3),

    checkboxInput(inputId = "indiv_obs",
                  label = "Show individual observations",
                  value = FALSE),

    checkboxInput(inputId = "density",
                  label = "Show density estimate",
                  value = FALSE),

    conditionalPanel(condition = "input.density == true",
                     sliderInput(inputId = "bw_adjust",
                                 label = "Bandwidth Adjustment",
                                 min = 0.2,
                                 max = 2,
                                 value = 1,
                                 step = 0.2))
  ),
  mainPanel(
    tabsetPanel(
      tabPanel("Plot", 
               plotOutput(
                 outputId = "histogram", 
                 height = "400px",
                 width = "400px")),
      tabPanel("Summary",
               verbatimTextOutput(outputId = "datsummary"))
    ))
)
)

服务器.R

library(shiny)

# Define server logic required to generate and plot a random distribution
shinyServer(function(input, output) {

  data <- reactive(rnorm(
    n = input$size, 
    mean = input$mu, 
    sd = input$sd
  ))

  output$histogram <- renderPlot({

    hist(data(),
         probability = TRUE,
         xlab = "Data",
         ylab = "Density",
         main = "Histogram of Random Samples")

    if(input$indiv_obs){
      rug(data())
    }

    if(input$density){
      dens <- density(data(), adjust = input$bw_adjust)
      lines(dens, col = "blue")
    }

  })

  output$datsummary <- renderPrint(summary(data()))
})

任何帮助是极大的赞赏！

4

4 回答 4

18

我现在想通了，我在 Shiny Homepage上检查了应用程序的 html 代码。并且通过将选项设置为、等，使用<div>html 中的 (Document Division) 标记调整 tabsetPanel 。后缀越高，划分的宽度越大。我只是在我的 ui.R 代码中添加标签：classspan1span2span3spandiv()

div(
      tabsetPanel(
        tabPanel("Plot", 
                 plotOutput(
                   outputId = "histogram", 
                   height = "400px",
                   width = "400px")),
        tabPanel("Summary",
                 verbatimTextOutput(outputId = "datsummary"))
        ), class = "span7")
于 2013-10-01T03:32:20.117 回答
12

另一种调整宽度（和高度）的方法：

添加

 ),  style='width: 1000px; height: 1000px' # end of tabsetPanel

在 tabsetPanel 之后，在这种情况下不需要 div()

于 2015-07-07T08:46:35.683 回答
2

上述示例在某些情况下有效。我需要一个更通用的解决方案。以下解决方案可以针对任何情况进行定制。例如，您的 Shiny 应用程序仍然可以响应。

我的解决方案

首先，在 tabsetPanel 之前创建一个 div 并给它一个类。其次，编写一段 jQuery/javascript 来查找该 div 的父元素。第三，使用 javascript/jQuery 改变这个父元素的类。您可以将类更改为您喜欢的任何内容，例如 col-sm-12、col-sm-11、其他一些标准 Bootstrap 类，或者您可以添加和创建自己的类。第四，将自定义 jQuery/javascript 添加到您的 Shiny 应用程序（确保将 .js 文件保存在 Shiny 应用程序的 www 文件夹中）。

这是我的例子：

Javascript/jQuery (general.js)：

$(function (){
    $("div.delParentClass").parent().removeClass("col-sm-8").addClass("col-sm-12");

/* In addClass you can specify the class of the div that you want. In this example, 
I make use of a standard Bootstrap class to change the width of the tabset: col-sm-12. 
If you want the tabset to be smaller use: col-sm-11, col-sm-10, ... or add
and create your own class. */

});

闪亮的用户界面

mainPanel(
    tags$head(tags$script(src="general.js")),
    div(class="delParentClass",
        tabsetPanel(
          tabPanel("Some panel", .....),
          tabPanel("Some panel", .....),
          tabPanel("Some panel", .....)
        )
    )
)
于 2016-06-12T22:05:55.093 回答
2

调整 和 宽度的另一种方法sidebarPanel是tabsetPanel分别基于修改和CSS 类的width属性。 使用并且可以将 CSS 直接添加到 Shiny UI。 有关详细信息，请参阅https://shiny.rstudio.com/articles/css.html。 这不是一个优雅的解决方案，但它可以正常工作。col-sm-4col-sm-8
tag$headtag$style

闪亮的用户界面

shinyUI(fluidPage(
  tags$head(
    tags$style(HTML("   
     .col-sm-4 { width: 25%;}
     .col-sm-8 { width: 75%;}
    "))
  ),       
  headerPanel(title = ""),
  sidebarPanel(
    sliderInput("size",
                "Number of Observations",
                min = 10,
                max = 200,
                value = 95),

    sliderInput("mu",
                "Mean",
                min = -100, 
                max = 100,
                value = 0),

    sliderInput("sd",
                "Standard Deviation",
                min = 1,
                max = 6,
                value = 3),

    checkboxInput(inputId = "indiv_obs",
                  label = "Show individual observations",
                  value = FALSE),

    checkboxInput(inputId = "density",
                  label = "Show density estimate",
                  value = FALSE),

    conditionalPanel(condition = "input.density == true",
                     sliderInput(inputId = "bw_adjust",
                                 label = "Bandwidth Adjustment",
                                 min = 0.2,
                                 max = 2,
                                 value = 1,
                                 step = 0.2))
  ),
  mainPanel(
    tabsetPanel(
      tabPanel("Plot", 
               plotOutput(
                 outputId = "histogram", 
                 height = "400px",
                 width = "400px")),
      tabPanel("Summary",
               verbatimTextOutput(outputId = "datsummary"))
    ))
)
)
于 2017-01-02T15:08:29.020 回答