2016-05-03 13 views
7

Chciałbym określić rozmiar okna przeglądarki w Shiny, aby pomóc mi w układaniu mojej działki lepiej. W szczególności chciałbym określić proporcje okna, aby zobaczyć, ile div powinienem rozłożyć na ekranie i nadal wygląda ładnie. Moja początkowa myśl polegała na tym, że liczba działek byłaby floor(width/(height-navbar_height)).Zdobądź rozmiar okna w Shiny

Poszukałem tego i obecnie nie jestem w stanie zlokalizować możliwego rozwiązania, a obecnie prowadzę do przekonania, że ​​ta funkcja jest po prostu nieobecna w strukturze clientData. jakieś pomysły?

Odpowiedz

16

Zobacz przykład poniżej. Używa JavaScript do wykrycia rozmiaru okna przeglądarki (rozmiar początkowy i dowolna zmiana rozmiaru) i użyć Shiny.onInputChange do przesłania danych do kodu serwera w celu przetworzenia. Wykorzystuje zdarzenie shiny:connected, aby uzyskać początkowy rozmiar okna, ponieważ Shiny.onInputChange nie jest gotowy do użycia, dopóki błyszczący nie zostanie podłączony.

library(shiny) 

# Define UI for application that draws a histogram 
ui <- shinyUI(fluidPage(

    # Application title 
    titlePanel("Old Faithful Geyser Data"), 

    # Sidebar with a slider input for number of bins 
    sidebarLayout(
     sidebarPanel(
     tags$head(tags$script(' 
           var dimension = [0, 0]; 
           $(document).on("shiny:connected", function(e) { 
            dimension[0] = window.innerWidth; 
            dimension[1] = window.innerHeight; 
            Shiny.onInputChange("dimension", dimension); 
           }); 
           $(window).resize(function(e) { 
            dimension[0] = window.innerWidth; 
            dimension[1] = window.innerHeight; 
            Shiny.onInputChange("dimension", dimension); 
           }); 
          ')), 
     sliderInput("bins", 
        "Number of bins:", 
        min = 1, 
        max = 50, 
        value = 30) 
    ), 

     # Show a plot of the generated distribution 
     mainPanel(
     verbatimTextOutput("dimension_display"), 
     plotOutput("distPlot") 
    ) 
    ) 
)) 

# Define server logic required to draw a histogram 
server <- shinyServer(function(input, output) { 
    output$dimension_display <- renderText({ 
     paste(input$dimension[1], input$dimension[2], input$dimension[2]/input$dimension[1]) 
    }) 

    output$distPlot <- renderPlot({ 
     # generate bins based on input$bins from ui.R 
     x <- faithful[, 2] 
     bins <- seq(min(x), max(x), length.out = input$bins + 1) 

     # draw the histogram with the specified number of bins 
     hist(x, breaks = bins, col = 'darkgray', border = 'white') 
    }) 
}) 

# Run the application 
shinyApp(ui = ui, server = server) 
+0

Dzięki za to. Przepraszam, że sprawdzanie trwało tak długo. Wydaje się jednak, że byłoby lepsze miejsce na dodanie tego poza sidebarPanel. Na przykład zaraz po wywołaniu fluidPage. –

+0

Nie ma znaczenia, gdzie dodasz JavaScript, ponieważ JavaScript pojawi się w sekcji "head" kodu HTML niezależnie (tak jak użyliśmy 'tags $ head'). Możesz zweryfikować kod źródłowy strony html. –

0

Krótsza wersja dla uzyskania wymiarów okna w błyszczące z JS z pakietu htmlwidgets:

window_height <- JS('window.innerHeight') 
window_width <- JS('window.innerWidth') 
Powiązane problemy