2014-07-08 4 views
8

bekam ich eine RStudio Shiny Server-Seite mit DataTables- und ich bekam TableTools und ColReorder im Beispiel unten zu arbeiten, aber ColVis (Show/hide columns Taste) nicht in http://datatables.net/extensions/colvis/ in der gleichen Weise wie das Beispiel verhalten:R glänzend Tables ColVis Verhalten

Wenn Sie auf die Schaltfläche Show/hide columns klicken, vermischt sich die Liste mit den Werten in der darunter liegenden Tabelle. Die Liste kann nicht durch erneutes Klicken auf die Schaltfläche oder durch Klicken auf eine andere Stelle auf der Seite ausgeblendet werden (auch hier verhält sich das Beispiel auf der Seite "Datenblätter") korrekt).

enter image description here

Auch ich bin verwirrt über sDom mit den verschiedenen Elementen in der Tabelle zu bestellen. Ich möchte die Show/hide columns Taste oben rechts statt oben links haben. Ich bin mir auch nicht sicher, wie man die verschiedenen Elemente in der sDom der Tabelle bestellt, so dass nach dem Ändern der Reihenfolge der Spalten, das Speichern in CSV/Excel oder das Ausblenden einer Spalte mir das neue Tabellenlayout anstelle des ursprünglichen geben.

Irgendwelche Ideen?

ui.R

shinyUI(pageWithSidebar(

h1('Diamonds DataTable with TableTools'), 
     tagList(
        singleton(tags$head(tags$script(src='//cdnjs.cloudflare.com/ajax/libs/datatables/1.9.4/jquery.dataTables.min.js',type='text/javascript'))), 
        singleton(tags$head(tags$script(src='//cdnjs.cloudflare.com/ajax/libs/datatables-tabletools/2.1.5/js/TableTools.min.js',type='text/javascript'))), 
        singleton(tags$head(tags$script(src='//cdn.datatables.net/colreorder/1.1.1/js/dataTables.colReorder.min.js',type='text/javascript'))), 
        singleton(tags$head(tags$script(src='//cdn.datatables.net/colvis/1.1.0/js/dataTables.colVis.min.js',type='text/javascript'))), 
        singleton(tags$head(tags$script(src='//cdnjs.cloudflare.com/ajax/libs/datatables-tabletools/2.1.5/js/ZeroClipboard.min.js',type='text/javascript'))), 
        singleton(tags$head(tags$link(href='//cdnjs.cloudflare.com/ajax/libs/datatables-tabletools/2.1.5/css/TableTools.min.css',rel='stylesheet',type='text/css'))), 
        singleton(tags$script(HTML("if (window.innerHeight < 400) alert('Screen too small');"))) 
       ), 
     dataTableOutput("mytable") 
    ) 
) 

server.R

shinyServer(function(input, output, session) { 
output$mytable = renderDataTable({ 
      diamonds[,1:6] 
     }, options = list(
       "sDom" = 'RMDCT<"clear">lfrtip', 
       "oTableTools" = list(
         "sSwfPath" = "//cdnjs.cloudflare.com/ajax/libs/datatables-tabletools/2.1.5/swf/copy_csv_xls.swf", 
         "aButtons" = list(
           "copy", 
           "print", 
           list("sExtends" = "collection", 
                "sButtonText" = "Save", 
                "aButtons" = c("csv","xls") 
               ) 
           ) 
        ) 
      ) 
    ) 
}) 
#

Außerdem gibt es ein Problem mit Spaltensortierung und Spalte Neuordnungs: wenn man Sorten dann neu ordnet Spalten und wieder sortiert Die Spaltenüberschriften werden umgedreht. Zum Beispiel, sortiere nach Spaltentiefe, dann spalte Spalte eins nach links, dann klicke erneut auf Header, um zu sortieren, jetzt haben wir Headertiefe mit Inhalten aus der falschen Spalte. Schnappschuss sehen:

enter image description here

+0

Sie nur für diese Bibliothek benötigen Sie die 'sDom' Option . Dann sollte das Widget korrekt angezeigt werden. Das Widget ändert jedoch Objekte im DOM, so dass Sie wahrscheinlich Aufrufe von 'Shiny.unbindAll()' und 'Shiny.bindAll()' integrieren müssen, siehe https://groups.google.com/forum/#!msg/shiny- discuss/IE6aQfKXd1I/M_IpblUUG9AJ – jdharrison

+0

wo sollten diese Aufrufe 'Shiny.unbindAll()' und 'Shiny.bindAll()' relativ zur Tabelle gemacht werden? – 719016

Antwort

6

Einige Anmerkungen:

Die aktuelle Version data.table mit glänzenden atm nicht kompatibel ist. Wir brauchen die 1.9.4 Version. Wir benötigen dann auch die vor 1.1.0 Version von colvis. Leider bezog sich dies auf eine alte Version von jQuery, die einen Anruf an jQuery.browser ausgab. Also Bezug auf diese jQuery.browser muss entfernt werden, es kommt in Zeile 856 bis 859 vor. Das sDom-Attribut ist auch ein bisschen schwierig, es erscheint nicht in der neuen data.table, die durch dom ersetzt wird. Dokumentation ist unter http://legacy.datatables.net/usage/options#sDom. Wir fügen den colVis-Inhalt unter Verwendung dieses Snippets <"cvclear"C> zu class="cvclear" hinzu. Platzieren Sie es oben, indem Sie es am Anfang der sDom Anweisung bestellen. Das funktioniert, aber wir müssen es richtig ausrichten. Normalerweise würde dies getan werden, indem align = "right" der Klasse hinzugefügt wird, aber weil die Klasse durch den sDom Aufruf initiiert wird, müssen wir stattdessen die HTML5 CSS text-align:right verwenden. Wir fügen dies unter Verwendung tags$style hinzu.

Also sollte das obige uns erlauben, colVis mit dem aktuellen Glanz zu verwenden. Bei glänzenden Upgrades auf data.table 1.10.0 sollten wir in der Lage sein, die aktuellen colVis Plugin-Dateien zu verwenden und die Korrekturen werden hoffentlich nicht notwendig sein.

Die folgenden Werke für mich:

ui. R

# get the colVis js file and delete lines 
library(RCurl) 
write(getURL("https://raw.githubusercontent.com/openMF/mifosx-community-apps/master/IndividualLendingGeneralJavaScript/resources/libs/DataTables-1.9.4/extras/ColVis/media/js/ColVis.js") 
     , file = 'www/colvis.js') 
tf <- readLines("www/colvis.js")[-c(856:859)] 
write(tf, file = "www/colvis.js") 
shinyUI({ 
    pageWithSidebar(

    h1('Diamonds DataTable with TableTools'), 
    tagList(
     singleton(tags$head(tags$script(src='//cdnjs.cloudflare.com/ajax/libs/datatables/1.9.4/jquery.dataTables.min.js',type='text/javascript'))), 
     singleton(tags$head(tags$script(src='//cdnjs.cloudflare.com/ajax/libs/datatables-tabletools/2.1.5/js/TableTools.min.js',type='text/javascript'))), 
     singleton(tags$head(tags$script(src='//cdn.datatables.net/colreorder/1.1.1/js/dataTables.colReorder.min.js',type='text/javascript'))), 
     singleton(tags$head(tags$script(src='colvis.js',type='text/javascript'))), 
     singleton(tags$head(tags$script(src='//cdnjs.cloudflare.com/ajax/libs/datatables-tabletools/2.1.5/js/ZeroClipboard.min.js',type='text/javascript'))), 
     singleton(tags$head(tags$link(href='//cdnjs.cloudflare.com/ajax/libs/datatables-tabletools/2.1.5/css/TableTools.min.css',rel='stylesheet',type='text/css'))), 
     singleton(tags$head(tags$link(href='https://raw.githubusercontent.com/openMF/mifosx-community-apps/master/IndividualLendingGeneralJavaScript/resources/libs/DataTables-1.9.4/extras/ColVis/media/css/ColVis.css',rel='stylesheet',type='text/css'))),  
     singleton(tags$script(HTML("if (window.innerHeight < 400) alert('Screen too small');"))), 
     singleton(tags$head(tags$link(href='https://raw.githubusercontent.com/DataTables/ColVis/18b52dfdd7255ffe96a92aadc16cadd70e3e174a/media/css/ColVis.css',rel='stylesheet',type='text/css'))) 
     , tags$head(
     tags$style(HTML(" 
         .cvclear{ 
         text-align:right}") 
     ) 
    ) 
    ), 
    dataTableOutput("mytable") 
) 
}) 

server.R

library(shiny) 
library(ggplot2) 

shinyServer(function(input, output, session) { 
    output$mytable = renderDataTable({ 
    diamonds[,1:6] 
    }, options = list(
    "sDom" = 'RMD<"cvclear"C><"clear"T>lfrtip', 
    "oTableTools" = list(
     "sSwfPath" = "//cdnjs.cloudflare.com/ajax/libs/datatables-tabletools/2.1.5/swf/copy_csv_xls.swf", 
     "aButtons" = list(
     "copy", 
     "print", 
     list("sExtends" = "collection", 
      "sButtonText" = "Save", 
      "aButtons" = c("csv","xls") 
     ) 
    ) 
    ) 
) 
) 
} 
) 

Sie die App sehen können:

http://128.199.255.233:3838/userApps/john/cvtestapp/ 

enter image description here

+0

Ich habe es am meisten funktioniert jetzt außer wenn man sortiert dann Spalten und Sortierungen wieder umordnet, werden die Spaltenüberschriften umgedreht. Zum Beispiel, sortieren nach Spalte 'Tiefe', dann Spalte eins nach links verschieben, dann klicken Sie erneut auf Header, um zu sortieren, jetzt haben wir Header' Tiefe' mit Inhalt aus der falschen Spalte ... (Snapshot in der Frage) – 719016

+0

Fehler in ColReorder und Sortierung ist noch da, aber ich denke, dass dies wahrscheinlich auf diese Frage bezogen ist, so werde ich diese Antwort als akzeptiert markieren :-) – 719016