Giter VIP home page Giter VIP logo

Comments (9)

ThomasSiegmund avatar ThomasSiegmund commented on July 4, 2024

Hi,

this may have been a recently fixed bug (missing/wrong dependency). Could you please try the current version of D3TableFilter? I've put your code in a complete app below for better reproducibilty.

Best

Thomas

library(shiny)
library(htmlwidgets)
library(D3TableFilter)
data(mtcars)

# ui.R
# --------------------------------------------------------
ui <- fluidPage(
  titlePanel('Test app'),
  sidebarLayout(
    sidebarPanel(
       wellPanel(HTML("Test app"))
    ),
    mainPanel(
      br(),
      d3tfOutput('mtcars')
    )
))

# server.R
# --------------------------------------------------------
server <- shinyServer(function(input, output, session) {
  
  output$mtcars <- renderD3tf({
    
    # Define table properties. See http://tablefilter.free.fr/doc.php
    # for a complete reference
    tableProps <- list(
      btn_reset = TRUE,
      # alphabetic sorting for the row names column, numeric for all other columns
      col_types = c("string", rep("number", ncol(mtcars)))
    );
    
    extensions <-  list(
      list(name = "sort"),
      list( name = "colsVisibility",
            at_start =  c(1,2,3,4,5),
            text = 'Hide columns: ',
            enable_tick_all =  TRUE
      ),
      list( name = "filtersVisibility",
            visible_at_start =  TRUE)
    );
    
    d3tf(mtcars,
         tableProps = tableProps,
         extensions = extensions,
         edit = TRUE,
         showRowNames = TRUE,
         tableStyle = "table table-bordered");
  })

})

from d3tablefilter.

afpapa2 avatar afpapa2 commented on July 4, 2024

The functionality now works, but there seems to be a visual glitch where the column utility buttons at the top right corner are overlapping no matter what resolution I am sized at.
image

from d3tablefilter.

ThomasSiegmund avatar ThomasSiegmund commented on July 4, 2024

In what environment do you see this problem? For me it works fine. Im using it on Linux and Windows, in Firefox and Chrome.

Sometimes such glitches are the result of stale files in the browser cache...

How does the TableFilter demo page look for you?

from d3tablefilter.

afpapa2 avatar afpapa2 commented on July 4, 2024

It works fine, but when I run it in R shiny in my chrome/windows7 browser it doesn't.

from d3tablefilter.

afpapa2 avatar afpapa2 commented on July 4, 2024

After more testing, it turns out that the real issue seems to be with the filtersVisibility extension. When I remove that the visual artifact goes away. According to this example: http://koalyptus.github.io/TableFilter/filters-visibility.html the filter visibility should be a small icon, however, in my application it is coming up as the word "Collapse" or "Expand" which takes up far more space than the small icon shown in the example. I think this is the root of the issue.

Not sure if this helps, but I went into dev tools in chrome and found some errors. Also, I cleared all the temp files in chrome.

Imgur

I'm also running this application from a business. I had to configure the install_git to go through a proxy to install your package. Not sure if any of that information helps or not.

from d3tablefilter.

ThomasSiegmund avatar ThomasSiegmund commented on July 4, 2024

This error messages about missing css files look like a recently fixed bug. Can you please make sure that you run the latest version? I have updated the D3TableFilter version to 0.71 today. The test app below should print this version in the left panel. I've attached a screenshot how this looks for me.

library(shiny)
library(htmlwidgets)
library(D3TableFilter)
data(mtcars)

# ui.R
# --------------------------------------------------------
ui <- fluidPage(
  titlePanel('Test app'),
  sidebarLayout(
    sidebarPanel(
       wellPanel(HTML(paste("D3TableFilter test app<br>Package version",
                            sessionInfo()$otherPkgs$D3TableFilter$Version)))
    ),
    mainPanel(
      br(),
      d3tfOutput('mtcars')
    )
))

# server.R
# --------------------------------------------------------
server <- shinyServer(function(input, output, session) {
  
  output$mtcars <- renderD3tf({
    
    # Define table properties. See http://tablefilter.free.fr/doc.php
    # for a complete reference
    tableProps <- list(
      btn_reset = TRUE,
      # alphabetic sorting for the row names column, numeric for all other columns
      col_types = c("string", rep("number", ncol(mtcars)))
    );
    
    extensions <-  list(
      list(name = "sort"),
      list( name = "colsVisibility",
            btn_text = "Hide Columns",
            enable_tick_all =  TRUE
      ),
      list( name = "filtersVisibility",
            visible_at_start =  TRUE)
    );
    
    
     colsResizableOpts <- list(resizeMode = "flex",
                              liveDrag = TRUE)
     
    d3tf(mtcars,
         tableProps = tableProps,
         extensions = extensions,
         edit = TRUE,
         showRowNames = TRUE,
         tableStyle = "table table-bordered",
         colsResizable = TRUE,
         colsResizableOptions = colsResizableOpts);
  })

})

runApp(list(ui=ui,server=server))

d3tf_hide_columns_screenshot

from d3tablefilter.

afpapa2 avatar afpapa2 commented on July 4, 2024

It still does not work for me.
Imgur

Are there any other dependencies that I need to check on?

from d3tablefilter.

ThomasSiegmund avatar ThomasSiegmund commented on July 4, 2024

Strange, I can't reproduce this. The text overlapping with the colum visibilty stuff seems to be a placeholder for the filters visibility icon. But this icon is in the package and should be found:

icn_exp.png

Any errors in the Javascript console?

from d3tablefilter.

afpapa2 avatar afpapa2 commented on July 4, 2024

Yes, I showed those errors in my 4th comment here. See above. Also, the file does exist and is the correct png, but still doesn't show in my app.

from d3tablefilter.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.