2017-02-09 23 views
0

Я ищу, чтобы изображение появилось в строке двойной щелчок в таблице данных. В текущем коде, который я написал, отображается предупреждающее сообщение при двойном щелчке по строке. Я хотел бы заменить это сообщение с изображением. Предложения по достижению того же.на строке двойной щелчок Изображение всплывает в datatable в R Shiny

Код

library(shiny) 
library(shinydashboard) 
library(DT) 

ui <- shinyUI(

dashboardPage (
dashboardHeader(title="Report"), 
dashboardSidebar(sidebarMenu(menuItem("Table",tabName="Table"))), 
dashboardBody(  
    tabItems(
    tabItem(tabName = "Table", 
      DT::dataTableOutput("DataTable")  
    ) 
)) 

)) 

server <- shinyServer(function(input, output) { 

output$DataTable <- DT::renderDataTable({ 
datatable(iris,rownames=FALSE,selection = 'single',options = list(
    searching = FALSE,ordering=FALSE, 
    dom = 'Bfrtip', 
    buttons = c('copy','excel', 'pdf', 'print', 'colvis'), 
    columnDefs = list(list(visible=FALSE, targets=c(2))), 
    rowCallback = JS(
    "function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {", 
    "var full_text = aData[2]", 
    # Tooltip for the rows 
    "$('td:eq(1)', nRow).attr('title', full_text);", 
    # Showing a hand as a cursor 
    "$('td:eq(1)', nRow).css('cursor','pointer');", 
    "$('td:eq(1)', nRow).css('font-weight','bold');", 
    "}") 
), 
#On double Click show Alert Message 
callback = JS(' 
       table.on("dblclick.dt","tr", function() { 
       var data=table.row(this).data(); 
       alert("You clicked on "+data[4]+"\'s row");} 
      ) 
       ') ) 
}) 
}) 

shinyApp(ui,server) 

ответ

0

Б «SweetAlert» вместо традиционных JS оповещения всплывающие окна, чтобы добавить изображение в таблицу данных строк щелчком мыши.

EDIT:

Пожалуйста, загрузите плагин Сладкие оповещения JS и CSS файл из этого ссылка- https://github.com/t4t5/sweetalert и поместите два файла в папке WWW. Расположение файла - sweetalert-мастер \ расстояние

Вот окончательный код:

library(shiny) 
library(shinydashboard) 
library(DT) 

ui <- shinyUI(

dashboardPage (
dashboardHeader(title="Report"), 
dashboardSidebar(sidebarMenu(menuItem("Table",tabName="Table"))), 
dashboardBody(
    # JS Script and CSS for SweetAlert Plugin 
    tags$head(HTML("<script type='text/javascript' src='sweetalert.min.js'> </script>")), 
    tags$head(
     tags$link(rel = "stylesheet", type = "text/css", href = "sweetalert.css") 
    ), 
    tabItems(
    tabItem(tabName = "Table", 
      DT::dataTableOutput("DataTable")  
    ) 
)) 

)) 

server <- shinyServer(function(input, output) { 

output$DataTable <- DT::renderDataTable({ 
datatable(iris,rownames=FALSE,selection = 'single',options = list(
    searching = FALSE,ordering=FALSE, 
    dom = 'Bfrtip', 
    buttons = c('copy','excel', 'pdf', 'print', 'colvis'), 
    columnDefs = list(list(visible=FALSE, targets=c(2))), 
    rowCallback = JS(
    "function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {", 
    "var full_text = aData[2]", 
    # Tooltip for the rows 
    "$('td:eq(1)', nRow).attr('title', full_text);", 
    # Showing a hand as a cursor 
    "$('td:eq(1)', nRow).css('cursor','pointer');", 
    "$('td:eq(1)', nRow).css('font-weight','bold');", 
    "}") 
), 
#On double Click show Alert Message 
callback = JS(' 
       table.on("dblclick.dt","tr", function() { 
       var data=table.row(this).data(); 
      swal({ 
      title: "Sweet!", 
      text: "Here a custom image.", 
      imageUrl: "http://wallpaper-gallery.net/images/high-resolution- image/high-resolution-image-2.jpg", 
      imageSize: "400x300" 
      }); 
} 
) 
    ')) 
}) 
}) 

shinyApp(ui,server) 
+1

Вы должны отметить необходимые JS и CSS файлы. Почему вы используете на самом деле 'src = 'sweetalert.min.js'>', а не 'sweetalert2.min.js'? Если OP загружается, я думаю, он загружает последний. – BigDataScientist

+0

@BigDataScientist Я использовал SweetAlert - https://github.com/t4t5/sweetalert, вы можете использовать SweetAlert или SweetAlert2 для достижения того же и, соответственно, файла JS и CSS Script. – string

+0

Моей целью является отредактировать ваше сообщение и указать, где OP должен загружать файлы и что он должен хранить его в папке «www» и т. Д. - иначе ваш код не будет воспроизводимым, что легко. Для меня это нормально, я работал с этим пакетом раньше;) – BigDataScientist