aruizga
aruizga

Reputation: 644

Increase size of rCharts on Shiny Dashboard

I am doing a Shiny Dashboard using the shinydashboard package. As you see in the image attached, the chart done using rCharts and the HighCharts library is not using all the space of the Box. I would like to know if anyone knows how to user all the space of the box. See attached the code used:

## app.R ##
library(shinydashboard)
library(rCharts)

ui <- dashboardPage(

  dashboardHeader(title = "Basic dashboard"),
  dashboardSidebar(),
  dashboardBody(
    fluidRow(
      tags$head(tags$style('.col-sm-6 {padding-left: 0px; padding-right: 0px ;}')),
      box(status = "primary", width = 3, showOutput("plotAtmosphere", "Highcharts")) 
      )
    )
  )


server <- function(input, output) {

  output$plotAtmosphere = renderChart({  
         a <- rHighcharts:::Chart$new()
          d <- data.frame(label = c("Negative", "Positive"), value = c(30, 70))
          a$title(text = "")
          # a <- hPlot(value ~ label, data = d, type = 'pie')
          a$data(x = c("Negative","Positive"), y = c(30, 70), type = "pie", name = "Amount")
          a$plotOptions(pie = list(innerSize = "90%", 
          startAngle = -90, endAngle = 90, center = list("50%", "100%"),dataLabels = list(enabled = F)))
          a$exporting(enabled = F)   
          a$chart(height = 150)   
          return(a)    })

}

shinyApp(ui, server)

enter image description here

Upvotes: 0

Views: 1651

Answers (2)

Ian Murray
Ian Murray

Reputation: 29

this is annoyingly complicated, but you have to pass an additional parameter to your server() fuction:

server <- function(input, output, session)

and then use one of the session variables from clientData to dynamically resize your plots:

output$hexchart<-renderChart2({
h1 <- Highcharts$new()
h1$chart(type = "spline")
h1$series(data = c(1, 3, 2, 4, 5, 4, 6, 2, 3, 5, NA), dashStyle = "longdash")
h1$series(data = c(NA, 4, 1, 3, 4, 2, 9, 1, 2, 3, 4), dashStyle = "shortdot")
h1$legend(symbolWidth = 80)
h1$set(width = session$clientData$output_plot1_width) #dynamically resize with session variable
return(h1)
})

where plot1 is a dummy plot inserted in your ui:

box(width = 12, height = 450, solidHeader = FALSE, status = "primary",
              plotOutput("plot1", height = "1px"),
              showOutput("hexchart","highcharts")
          )

Upvotes: 2

Dieter Menne
Dieter Menne

Reputation: 10215

Add CSS:

## app.R ##
library(shinydashboard)

ui <- dashboardPage(


  dashboardHeader(title = "Basic dashboard"),
  dashboardSidebar(),
  dashboardBody(
    # Boxes need to be put in a row (or column)
    fluidRow(
      tags$head(tags$style('.col-sm-6 {padding-left: 0px; padding-right: 0px ;}')),
      box(plotOutput("plot1", height = 250)),

      box(
        title = "Controls",
        sliderInput("slider", "Number of observations:", 1, 100, 50)
      )
    )
  )
)

server <- function(input, output) {
  set.seed(122)
  histdata <- rnorm(500)

  output$plot1 <- renderPlot({
    data <- histdata[seq_len(input$slider)]
    hist(data)
  })
}

shinyApp(ui, server)

Upvotes: 0

Related Questions