在R Shiny中,你可以使用JavaScript来监听键盘事件,并根据这些事件来移动渲染的图像。以下是一个基本的示例,展示了如何实现这一功能。
以下是一个简单的示例,展示了如何在R Shiny中使用箭头键移动用户上传的图像。
library(shiny)
ui <- fluidPage(
titlePanel("Move Image with Arrow Keys"),
sidebarLayout(
sidebarPanel(
fileInput("file", "Choose an image...", accept = c("image/png", "image/jpeg"))
),
mainPanel(
tags$head(tags$script(src = "https://code.jquery.com/jquery-3.6.0.min.js")),
tags$head(tags$script('
$(document).on("shiny:connected", function(event) {
$(document).keydown(function(e) {
var img = $("#image");
var offset = img.offset();
switch(e.which) {
case 37: // Left arrow
offset.left -= 10;
break;
case 38: // Up arrow
offset.top -= 10;
break;
case 39: // Right arrow
offset.left += 10;
break;
case 40: // Down arrow
offset.top += 10;
break;
}
img.offset(offset);
});
});
')),
uiOutput("image")
)
)
)
server <- function(input, output) {
output$image <- renderUI({
if (!is.null(input$file)) {
tags$img(id = "image", src = input$file$datapath, style = "position: absolute;")
}
})
}
shinyApp(ui, server)
通过这种方式,你可以在R Shiny中实现使用箭头键移动用户上传的图像。希望这个示例对你有所帮助!
领取专属 10元无门槛券
手把手带您无忧上云