Javascript 在全屏模式下添加一个按钮,以在闪亮的应用程序中重置为正常模式
在下面的应用程序中,当我按下Javascript 在全屏模式下添加一个按钮,以在闪亮的应用程序中重置为正常模式,javascript,r,shiny,Javascript,R,Shiny,在下面的应用程序中,当我按下actionButton()时,我会看到绘图的全屏。当在绘图下处于全屏模式时,是否可以使用按钮返回,而不是单击计算机上的“Esc” library(shiny) library(ggplot2) js <- " function openFullscreen(elem) { if (elem.requestFullscreen) { elem.requestFullscreen(); } else if (elem.mozReques
actionButton()
时,我会看到绘图的全屏。当在绘图下处于全屏模式时,是否可以使用按钮返回,而不是单击计算机上的“Esc”
library(shiny)
library(ggplot2)
js <- "
function openFullscreen(elem) {
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.mozRequestFullScreen) { /* Firefox */
elem.mozRequestFullScreen();
} else if (elem.webkitRequestFullscreen) { /* Chrome, Safari and Opera */
elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) { /* IE/Edge */
elem.msRequestFullscreen();
}
}"
css <- "
#ggplot:-webkit-full-screen {
height: 100%;
margin: 0;
}
#ggplot:-ms-fullscreen {
height: 100%;
}
#ggplot:fullscreen {
height: 100%;
}"
ui <- fluidPage(
tags$head(
tags$script(HTML(js)),
tags$style(HTML(css))
),
br(),
fluidRow(
column(
width = 3,
actionButton(
"fs", "Full screen",
onclick = "openFullscreen(document.getElementById('ggplot'));"
)
),
column(
width = 9,
plotOutput("ggplot")
)
)
)
server <- function(input, output, session){
output[["ggplot"]] <- renderPlot({
ggplot(iris, aes(Sepal.Length, Sepal.Width)) + geom_point()
})
}
shinyApp(ui, server)
库(闪亮)
图书馆(GG2)
js库(闪亮)
图书馆(GG2)
js库(闪亮)
图书馆(GG2)
js谢谢这是正确的方向,但是按钮只能在全屏模式下显示吗?@firmo23对我来说,它只能在全屏模式下显示。你能在Rstudio云环境中检查它吗?或者在浏览器模式下检查它而不是在本地吗?@firmo23啊,不,你是对的。请尝试onclick=“exitFullscreen();$(“#ggplot”).removeClass('fullscreen');$(this.hide();”
。谢谢,这是正确的方向,但是按钮只能在全屏模式下显示吗?@firmo23它只能在全屏模式下显示,对我来说。你能在Rstudio云环境下或者在浏览器模式下而不是本地进行检查吗?@firmo23啊,不,你是对的。请尝试onclick=“exitFullscreen();$('#ggplot').removeClass('fullscreen');$(this.hide();”
。谢谢你的帮助
library(shiny)
library(ggplot2)
js <- "
function openFullscreen(elem, plotselector) {
$('#exitbtn').show();
$(plotselector).addClass('fullscreen');
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.mozRequestFullScreen) { /* Firefox */
elem.mozRequestFullScreen();
} else if (elem.webkitRequestFullscreen) { /* Chrome, Safari and Opera */
elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) { /* IE/Edge */
elem.msRequestFullscreen();
}
}
function exitFullscreen() {
$('#exitbtn').hide();
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.webkitExitFullscreen) { /* Safari */
document.webkitExitFullscreen();
} else if (document.msExitFullscreen) { /* IE11 */
document.msExitFullscreen();
}
}
"
css <- "
#exitbtn {
display: none;
}
.fullscreen {
height: 90% !important;
margin: 0 !important;
}
"
ui <- fluidPage(
tags$head(
tags$script(HTML(js)),
tags$style(HTML(css))
),
br(),
fluidRow(
column(
width = 3,
actionButton(
"fs", "Full screen",
onclick = "openFullscreen(document.getElementById('frame'), '#ggplot');"
)
),
column(
width = 9,
div(
id = "frame",
plotOutput("ggplot"),
actionButton(
"exitbtn", "Exit",
onclick = "exitFullscreen(); $('#ggplot').removeClass('fullscreen');"
)
)
)
)
)
server <- function(input, output, session){
output[["ggplot"]] <- renderPlot({
ggplot(iris, aes(Sepal.Length, Sepal.Width)) + geom_point()
})
}
shinyApp(ui, server)