8

I am looking to render a 2 column report as a stand-alone HTML file using R and Markdown only. I am very new to markdown within R, so I need some help with the layout.

The image below displays the layout of what I would like to render using RMarkdown.

enter image description here

The HTML is on the left hand side and some data along the right hand side.

The raw HTML and the example dataframe can be found here:

Note: I used the pander package to create the table using the following command:

pandoc.table(df, style="rmarkdown")
Btibert3
  • 38,798
  • 44
  • 129
  • 168
  • 5
    Whoever voted to close this, can they post an explanation as to why this is off topic? The OP is just asking how to achieve a two column layout using R Markdown. He has posted very clearly what he wants, along with some code to achieve the same. It beats me as to how this is not related to programming. I think an explanation is in order. – Ramnath Oct 08 '13 at 01:43
  • 2
    I see the reason for seeking closure in the close request. But instead of being negative right from the outset, why not nudge the OP first to do what it would take to make the question comply? – Ramnath Oct 08 '13 at 02:03
  • 1
    What about simply wrapping the image and the table between `
    ...
    ` tags (separately)? More info: http://css-tricks.com/all-about-floats/     – daroczig Oct 08 '13 at 20:09
  • @daroczig Right now, my ideal workflow would be to query the HTML from my database and render that (Sized appropriately) on the flow. If needed, I will write a process to save the HTML as images and use that in my report. That said, I will surely look into CSS stylings. I didnt want to reinvent the wheel if this was already baked into `knitr`, `slidify` or other `rmarkdown` for that matter. – Btibert3 Oct 09 '13 at 15:56

1 Answers1

15

Although this is not a perfect solution, it is a place to get started: Yihui recently added HTML templates to knitr, and docco is a example two-column page: http://cran.r-project.org/web/packages/knitr/vignettes/docco-classic.html .

You can see the template file used for that output here: https://github.com/yihui/knitr/blob/master/inst/misc/docco-template.html.

Alternatively, you can try placing inline HTML right in your R Markdown chunks, but this is terribly hacky and you might feel like a bad person for doing it. We use results='asis' so that the cated HTML is rendered properly, and out.extra='' to ensure that the HTML used to generate the figures is generated right away, rather than the Markdown language for image inclusion.

```{r two-column, results='asis', echo=FALSE, out.extra=''}
library(knitr)
cat("<table class='container'><tr>")
cat("<td>")
plot( rnorm(10) )
cat("</td>")
cat("<td>")
kable( rnorm(10), format="html" )
cat("</td>")
cat("</tr></table>")
```

Calling knit on that should produce a 2 column layout for that particular chunk (although without any nice styling for the table; you might add that in yourself with some CSS)

Kevin Ushey
  • 20,530
  • 5
  • 56
  • 88
  • Interesting approach. I hadn't thought about putting in some basic HTML to break it out. My rationale for the question is that I see packages like Slidify and the Dev versin of RStudio allow for 2-column layouts. As such, I didnt know if there was an obvious way to break apart two code chunks – Btibert3 Oct 08 '13 at 12:55
  • I was hoping to avoid writing code at this level, but you showed above its fairly straight forward to customize the dirty parts on the fly. Thanks so much! – Btibert3 Oct 12 '13 at 03:33
  • @Kevin Ushey I tried your solution. Thanks, it is not looking nice as you said. Specially, when the size of the browser changes, the tables do not show completely. Is it possible for you to give a better solution or add css? since I am not familiar with it. – Elaheh kamaliha Aug 28 '14 at 18:23
  • I just noticed that this only happens in chrome. – Elaheh kamaliha Aug 28 '14 at 19:07
  • 1
    It's been a very long time, but it's worth updating this answer, it's possible to use `***` to separate columns (only two). – Molx Jun 13 '15 at 20:18
  • Very similar methodology: https://stackoverflow.com/questions/17717323/align-two-data-frames-next-to-each-other-with-knitr/17739804#17739804 – geneorama Sep 16 '15 at 15:12