RMarkdown and JavaScript

Michael

unread,

Jan 22, 2016, 5:30:12 PM1/22/16

to Davis R Users' Group

Hi all,

I have two separate but possibly related issues. I'm generating JavaScript from .Rmd and want to A) programmatically generate html files from RMarkdown, and B) get JS onto my Jekyll Bootstrap site. Here's what I've tried for (A); the approach works as long as the output doesn't contain JavaScript. Any thoughts or pointers to online help would be welcome.

test.Rmd:

---

title: "test"

output: html_document

---

```{r}

require(visNetwork, quietly = TRUE)

nodes <- data.frame(id = 1:3)

edges <- data.frame(from = c(1,2), to = c(1,3))

visNetwork(nodes, edges, width = "100%")

```

Call that with:

knit(input = 'test.Rmd', output = 'test.md')

The .md:

---

title: "test"

output: html_document

---

<div id="htmlwidget-124" style="width:100%;height:504px;" class="visNetwork"></div>

And then .md -> .html with pandoc:

system('pandoc -s -o test_pandoc.html test.md')

Yields the following, which displays only the 'test' title.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

</head>

<body>

</div>

</div>

</body>

</html>

I tried markdown-js too, but fared even worse:

system('md2html test.md > test_md2html.html')

Yields:

<hr/>

<p><div id="htmlwidget-124" style="width:100%;height:504px;" class="visNetwork"></div>

Jaime Ashander

unread,

Jan 22, 2016, 6:03:40 PM1/22/16

to davi...@googlegroups.com

I'm not sure if this is helpful, but your test.Rmd works for me using rmarkdown::render (e.g, via Rstudio's Knit HTML button), which produces the attached html. But, this has a big embedded /obfuscated script.

I guess you could reproduce this with knitr/pandoc by adding some of the pandoc flags that rmarkdown::render uses. I listed these, for my system, below. I suspect the self-contained and stand-alone flags may be enough.

- Jaime

/usr/local/bin/pandoc +RTS -K512m -RTS test.utf8.md --to html --from markdown+autolink_bare_uris+ascii_identifiers+tex_math_single_backslash-implicit_figures --output test.html --smart --email-obfuscation none --self-contained --standalone --section-divs --template /Library/Frameworks/R.framework/Versions/3.2/Resources/library/rmarkdown/rmd/h/default.html --variable 'theme:bootstrap' --include-in-header /var/folders/1d/dp4qqycx6_58nmhgn97lvsvr0000gp/T//RtmpWjAErO/rmarkdown-strf45f222c4cb7.html --mathjax --variable 'mathjax-url:https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML' --no-highlight --variable highlightjs=/Library/Frameworks/R.framework/Versions/3.2/Resources/library/rmarkdown/rmd/h/highlight

Session info:

package * version date source

devtools * 1.9.1 2015-09-11 CRAN (R 3.2.0)

digest 0.6.9 2016-01-08 CRAN (R 3.2.3)

htmltools 0.2.6 2014-09-08 CRAN (R 3.2.0)

htmlwidgets 0.5 2015-06-21 CRAN (R 3.2.0)

jsonlite 0.9.19 2015-11-28 CRAN (R 3.2.2)

lintr * 0.2.0 2014-12-01 CRAN (R 3.2.0)

magrittr 1.5 2014-11-22 CRAN (R 3.2.0)

memoise 0.2.1 2014-04-22 CRAN (R 3.2.0)

rex 1.0.1 2015-04-28 CRAN (R 3.2.0)

rmarkdown 0.8 2015-08-30 CRAN (R 3.2.1)

visNetwork * 0.2.0 2015-12-21 CRAN (R 3.2.3)

yaml 2.1.13 2014-06-12 CRAN (R 3.2.0)

--
Check out our R resources at http://www.noamross.net/davis-r-users-group.html
---
You received this message because you are subscribed to the Google Groups "Davis R Users' Group" group.
To unsubscribe from this group and stop receiving emails from it, send an email to davis-rug+...@googlegroups.com.
Visit this group at https://groups.google.com/group/davis-rug.
For more options, visit https://groups.google.com/d/optout.

test.html

Brandon Hurr

unread,

Jan 22, 2016, 7:15:47 PM1/22/16

to davi...@googlegroups.com

From my experience, Rstudio embeds everything into those encoded scripts that it needs to render the page (that it is aware of).

I sometimes use jquery in some reports I make and I have to add a line in the top of my file.

</script>

Rstudio incorporates this into the output. The problem with this approach is that if you're running a webpage, your scripts might be reused and you should store them in a single place, or have your user go fetch them from the interwebs.

Yihui told me a while ago that bootstrap stylings and mathjax are embedded automagically in HTML Rmd outputs through Rstudio. You can turn this off in the YAML header (highlighted in pink) and it will save significant size of the final file.

output:

html_document:

mathjax: null

theme: null

highlight: null

pandoc_args: [

"+RTS", "-K64m",

"-RTS"

]

It looks like everything is fine, but you're missing a required visualization library for the visNetwork output in your non-Rstudio output. If you want to embed that, you need to know what it needs I guess. I can't seem to find anything specific enough to your issue though.

This, kind of indicates how you could do it, but you have to know what you need (I think).

https://github.com/al2na/Rmarkdown_JSviz/blob/master/rCharts.Rmd

From the html on the docs page it looks like you need the following:

https://github.com/DataKnowledge/DataKnowledge.github.io/blob/master/visNetwork/options.html

I'm unsure where all of these are out there in the ether. I guess this is what makes Rstudio easier, but it would be nice to know how it does it so you know what to do in its absence.

B

Noam Ross

unread,

Jan 23, 2016, 1:10:39 PM1/23/16

to davi...@googlegroups.com

I've been dealing with similar issues lately and I've found the crux of the issue is that the rmarkdown template html_document (or html_document_base), contains a bunch of machinery for detecting and embedding the needed javascript libraries for HTML widgets like visNetwork. This occurs in post-processing after knitting but before pandoc conversion. (It's where the --include-in-header part of the pandoc call comes from.) It's hard to get around this and separate the knitting from the HTML conversion for this case. One option is to modify the html_document(_base) template to include a Jekyll YAML header, so you a put a pre-rendered HTML file in your jekyll site rather than an .md but still have the appropriate metadata.

Reply all

Reply to author

Forward