White space from screenshots with data in Rmarkdown PDF

Question

I had a problem with a new opportunity to take a screenshot of html widgets for further implementation, for example, in a pdf document. The screenshot of the datatable ( DT ) package is too high, which looks like a space in the rmarkdown document (it can be easily identified by the position fig.cap , i.e. below the end of the datatable ). I cannot understand why this is happening, and I would like to remove it (without a space under the datatable ). See the example below for test.Rmd , which fully shows the problem:

 --- output: pdf_document: toc: yes header-includes: - \usepackage{fancyhdr} - \usepackage[ngerman]{babel} --- \addtolength{\headheight}{1.0cm} \pagestyle{fancyplain} \renewcommand{\headrulewidth}{0.4pt} \renewcommand{\footrulewidth}{0.4pt} \chead{Test} \lhead{\scriptsize\today} ```{r, fig.align='center', fig.pos='htb!', fig.width=12, fig.cap="The height of screenshot is too high!!",fig.height=3,echo=FALSE, cache=FALSE, warning = FALSE, message = FALSE, tidy=TRUE} library(DT) library(webshot) datatable(mtcars[1:2,],rownames=FALSE, options = list(dom='t',ordering=F)) ``` 

• In addition, I tried a different number of displayed rows in a datatable , and I noticed that if the datatable string has> 20 , then the digit displays well with the signature.
• However, my table in the original pdf file has, for example, 2 lines ( maybe more → the number of lines is reactive, since this is a rmarkdown empty report related to the shiny app ), so in the example I used only two lines from the mtcars .

Answer 1

Can you try adding the following to r chunk and see if this works:

 screenshot.opts = list(delay = 1, cliprect = c(0, 0, 1000, 150)), dev='jpeg' 

Answer 2

On the webpage from which you grab the table, is there a CSS selector? If you can find one that covers only the table, it can just capture the table, not a snapshot of the entire page. See this example:

 webshot("http://www.nfl.com/superbowl/results/superbowl/", "nfl.png", selector = "div.columnStats") 

To find the CSS selector, I went to the webpage (in this case http://www.nfl.com/superbowl/results/superbowl/ ) in the browser, and then press Ctrl + u to view the source. I scrolled until I found a table and on line 1374 found

 <!-- Records table --> <div class="columnStats"> 

I translated the div class="columnStats" into the div.columnStats option that I specified for the selector.

Windows

I was able to reproduce your error. Does your real application have a CSS selector that you can specify? (see NFL example above).

MAC

No problem with spaces. Here is what I did:

I have never used DT , webshot or PhantomJS. So after:

 install.packages("DT") install.packages("webshot") webshot::install_phantomjs() 

I put in a test. Let's say you posted on my mac and got: