2014-09-25 81 views
1

我有一個數千像素高度和寬度的靜態png文件,我想通過在RStudio Shiny網站中交互放大和縮小它來顯示部分if。以相對良好的方式進行工作的最佳方式是什麼?RStudio中的可縮放圖像Shiny

回答

1

您可以使用任何一種JavaScript庫。我選擇了https://github.com/elevateweb/elevatezoom在這個例子中使用:

library(shiny) 
runApp(
    list(ui = fluidPage(
    tags$head(tags$script(src = "http://www.elevateweb.co.uk/wp-content/themes/radial/jquery.elevatezoom.min.js")), 
     actionButton("myBtn", "Press Me for zoom!"), 
     uiOutput("myImage"), 
    singleton(
     tags$head(tags$script('Shiny.addCustomMessageHandler("testmessage", 
    function(message) { 
    $("#myImage img").elevateZoom({scrollZoom : true}); 
    } 
);')) 
    ) 
    ) 
     , server = function(input, output, session){ 
     output$myImage <- renderUI({ 
      img(src = "http://i.stack.imgur.com/RWd7T.png?s=128&g=1", "data-zoom-image" ="http://i.stack.imgur.com/RWd7T.png?s=128&g=1") 
     }) 

     observe({ 
      if(input$myBtn > 0){ 
      session$sendCustomMessage(type = 'testmessage', 
             message = list())    
      } 
     }) 
     } 
     ) 
) 

enter image description here

+0

額外的問題:我可以觸發從圖像的一部分選擇矩形未來的事件?我明確希望能夠選擇正方形以外的矩形。如果與此基本不同,我可以將其作爲一個新問題發佈。 – 719016 2014-09-25 18:42:22

+0

不知道我明白你在問什麼。我認爲帖子是一個單獨的問題。 – jdharrison 2014-09-25 19:37:41

+0

http://stackoverflow.com/questions/26047869/zoomable-and-selectable-image-in-rstudio-shiny – 719016 2014-09-25 20:51:28