New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Using htmlwidgets graphics with servr::jekyll() #8

Open
dfalbel opened this Issue May 20, 2015 · 14 comments

Comments

Projects
None yet
6 participants
@dfalbel

dfalbel commented May 20, 2015

I'm trying to use metricsgraphics with my jekyll blog but I can't find where I'm missing something.

It seems that the div is created but the graphic never shows up.

Take a look at this: http://dfalbel.github.io/knitr-jekyll/2014/09/jekyll-with-knitr.html

However when I just knit the file in RStudio, evrything works great. See this file:
https://github.com/dfalbel/knitr-jekyll/blob/gh-pages/_source/2014-09-28-jekyll-with-knitr.html

I also tried this with others htmlwidgets like recharts and chartist.

Thanks for the help!

@yihui

This comment has been minimized.

Show comment
Hide comment
@yihui

yihui May 21, 2015

Owner

HTML widgets only work in these cases:

  1. R console
  2. RStudio viewer
  3. R Markdown v2

What servr::jekyll() does is simply knitting .Rmd to .md. Then Jekyll renders .md to .html, and Jekyll knows nothing about HTML widgets. Your best bet is not to use Jekyll, but to use R Markdown v2, which is what we use to build several widget package websites, e.g.

In these cases we use Makefile and server::make().

Owner

yihui commented May 21, 2015

HTML widgets only work in these cases:

  1. R console
  2. RStudio viewer
  3. R Markdown v2

What servr::jekyll() does is simply knitting .Rmd to .md. Then Jekyll renders .md to .html, and Jekyll knows nothing about HTML widgets. Your best bet is not to use Jekyll, but to use R Markdown v2, which is what we use to build several widget package websites, e.g.

In these cases we use Makefile and server::make().

@dfalbel

This comment has been minimized.

Show comment
Hide comment
@dfalbel

dfalbel May 21, 2015

Alright! I tought htmlwidgets could print raw html, just like the googleVis package.
Thanks Yihui!
I'll try to move my blog to this format!

dfalbel commented May 21, 2015

Alright! I tought htmlwidgets could print raw html, just like the googleVis package.
Thanks Yihui!
I'll try to move my blog to this format!

@jhollist

This comment has been minimized.

Show comment
Hide comment
@jhollist

jhollist Jul 2, 2015

Apologies for digging up an old issue...

@dfalbel I wanted to do the same thing with the leaflet package. Whole site is served as a gh-pages jekyll site. Hack that I got to work was to include the required js and css in a folder at the root of the site then make sure the links get added to the header. Just added those links to my default.html layout.

Examples:

I am certain @yihui 's solution is the better one, but we didn't have time to re-work the site so this hack did the trick.

jhollist commented Jul 2, 2015

Apologies for digging up an old issue...

@dfalbel I wanted to do the same thing with the leaflet package. Whole site is served as a gh-pages jekyll site. Hack that I got to work was to include the required js and css in a folder at the root of the site then make sure the links get added to the header. Just added those links to my default.html layout.

Examples:

I am certain @yihui 's solution is the better one, but we didn't have time to re-work the site so this hack did the trick.

@yihui

This comment has been minimized.

Show comment
Hide comment
@yihui

yihui Jul 2, 2015

Owner

@jhollist Thanks for an alternative solution. Yeah, that will also work. The only problem is that if the widgets packages are updated, you will have to manually update the JS/CSS files accordingly (unless you don't care about the new versions).

Owner

yihui commented Jul 2, 2015

@jhollist Thanks for an alternative solution. Yeah, that will also work. The only problem is that if the widgets packages are updated, you will have to manually update the JS/CSS files accordingly (unless you don't care about the new versions).

@semiexpert

This comment has been minimized.

Show comment
Hide comment
@semiexpert

semiexpert Sep 5, 2015

@yihui I really like all the graphs and tables to be interactive in a blog. dygraphs and DT are my favorite packages for writing reports. Do you have any tutorial how to make the sites?https://github.com/rstudio/leaflet/tree/gh-pages

Thanks!
Richard

semiexpert commented Sep 5, 2015

@yihui I really like all the graphs and tables to be interactive in a blog. dygraphs and DT are my favorite packages for writing reports. Do you have any tutorial how to make the sites?https://github.com/rstudio/leaflet/tree/gh-pages

Thanks!
Richard

@yihui

This comment has been minimized.

Show comment
Hide comment
@yihui

yihui Sep 5, 2015

Owner

@semiexpert The websites of DT, leaflet, and dygraphs are all made from R Markdown v2. DT and leaflet websites are compiled through a Makefile. To learn more about R Markdown v2, see http://rmarkdown.rstudio.com; to learn Makefile, see http://kbroman.org/minimal_make/ servr::jekyll() is not what you want to use in these cases; servr::make() is.

Owner

yihui commented Sep 5, 2015

@semiexpert The websites of DT, leaflet, and dygraphs are all made from R Markdown v2. DT and leaflet websites are compiled through a Makefile. To learn more about R Markdown v2, see http://rmarkdown.rstudio.com; to learn Makefile, see http://kbroman.org/minimal_make/ servr::jekyll() is not what you want to use in these cases; servr::make() is.

@brendan-r

This comment has been minimized.

Show comment
Hide comment
@brendan-r

brendan-r Oct 19, 2015

Firstly, thanks so much for this repo!

I'm using it with pandoc as my Jekyll markdown renderer. It seems a shame to lose the nice features of servr::jekyll() in order to use htmlwidgets.

Would htmlwidgets work if the --include-in-header /tmp/... argument (as generated by rmarkdown) was passed to pandoc when called by Jeykll, or is there something else to it?

Based on my shaky understanding, it seems like it might be possible to wrap servr::jekyll() in a function which pre-emptively:

  • parses the .Rmd file for html dependencies
  • copies necessary js/css files from the R packages to a Jekyll dependencies dir
  • produces a file pointing to them, for the --include-in-header argument passed to pandoc

The last two look like they could be achieved by passing an rmarkdown dependencies object to rmarkdown:::html_dependencies_as_string. However, after spending a while reading through the internals in rmarkdown, I can't see how to derive a dependencies object for arbitrary .Rmd files (it looks like knitr::knit_meta is involved, but I can't piece together how).

My questions are:

  • Would the above (theoretically) work?
  • Do you have any hints on how to derive an rmarkdown dependencies list, for an arbitrary .Rmd file?

brendan-r commented Oct 19, 2015

Firstly, thanks so much for this repo!

I'm using it with pandoc as my Jekyll markdown renderer. It seems a shame to lose the nice features of servr::jekyll() in order to use htmlwidgets.

Would htmlwidgets work if the --include-in-header /tmp/... argument (as generated by rmarkdown) was passed to pandoc when called by Jeykll, or is there something else to it?

Based on my shaky understanding, it seems like it might be possible to wrap servr::jekyll() in a function which pre-emptively:

  • parses the .Rmd file for html dependencies
  • copies necessary js/css files from the R packages to a Jekyll dependencies dir
  • produces a file pointing to them, for the --include-in-header argument passed to pandoc

The last two look like they could be achieved by passing an rmarkdown dependencies object to rmarkdown:::html_dependencies_as_string. However, after spending a while reading through the internals in rmarkdown, I can't see how to derive a dependencies object for arbitrary .Rmd files (it looks like knitr::knit_meta is involved, but I can't piece together how).

My questions are:

  • Would the above (theoretically) work?
  • Do you have any hints on how to derive an rmarkdown dependencies list, for an arbitrary .Rmd file?
@yihui

This comment has been minimized.

Show comment
Hide comment
@yihui

yihui Oct 19, 2015

Owner

@brendan-r I think you are on the right track, but unfortunately I don't know the exact details of rendering dependencies, either. My gut feeling is that Jekyll may not be the right tool to render R Markdwon v2 documents. Actually it might be easier to design a new blog system, build HTML locally, and push to Github directly instead of relying on Jekyll to render Markdown to HTML.

Owner

yihui commented Oct 19, 2015

@brendan-r I think you are on the right track, but unfortunately I don't know the exact details of rendering dependencies, either. My gut feeling is that Jekyll may not be the right tool to render R Markdwon v2 documents. Actually it might be easier to design a new blog system, build HTML locally, and push to Github directly instead of relying on Jekyll to render Markdown to HTML.

@Nicktz

This comment has been minimized.

Show comment
Hide comment
@Nicktz

Nicktz Nov 5, 2015

@yihui In reference to the websites (Leaflet and DT) you mentioned: is there an accessible tutorial for creating a website structure similar to what you did there from Rmarkdown? Are the index.html scripts created in Rmd or by hand? I.e. would I need to create it by hand as well? And lastly, is there a way to include JS scripts to my created html files using render() directly from R?

Nicktz commented Nov 5, 2015

@yihui In reference to the websites (Leaflet and DT) you mentioned: is there an accessible tutorial for creating a website structure similar to what you did there from Rmarkdown? Are the index.html scripts created in Rmd or by hand? I.e. would I need to create it by hand as well? And lastly, is there a way to include JS scripts to my created html files using render() directly from R?

@yihui

This comment has been minimized.

Show comment
Hide comment
@yihui

yihui Nov 5, 2015

Owner

@Nicktz Please see the links in my very first reply, e.g. you can see there is an index.Rmd, so index.html was generated from it instead of being manually edited. There is a section "Creating a website" at http://rmarkdown.rstudio.com/html_document_format.html

Owner

yihui commented Nov 5, 2015

@Nicktz Please see the links in my very first reply, e.g. you can see there is an index.Rmd, so index.html was generated from it instead of being manually edited. There is a section "Creating a website" at http://rmarkdown.rstudio.com/html_document_format.html

@Nicktz

This comment has been minimized.

Show comment
Hide comment
@Nicktz

Nicktz Nov 5, 2015

Thanks @yihui will do!

Nicktz commented Nov 5, 2015

Thanks @yihui will do!

@brendan-r

This comment has been minimized.

Show comment
Hide comment
@brendan-r

brendan-r Nov 16, 2015

I cobbled together a solution for my knitr-jekyll blog a while ago. It can all be handled with a small addition to build.R, and a short addition to one of the html template files. Write-up here: http://brendanrocks.com/htmlwidgets-knitr-jekyll/, and changes in a fork here.

brendan-r commented Nov 16, 2015

I cobbled together a solution for my knitr-jekyll blog a while ago. It can all be handled with a small addition to build.R, and a short addition to one of the html template files. Write-up here: http://brendanrocks.com/htmlwidgets-knitr-jekyll/, and changes in a fork here.

@dfalbel

This comment has been minimized.

Show comment
Hide comment
@dfalbel

dfalbel commented Nov 16, 2015

Thanks @brendan-r

@yihui

This comment has been minimized.

Show comment
Hide comment
@yihui

yihui Jan 13, 2016

Owner

@brendan-r I just want to say this is very impressive! The more I think about these issues, the more I want to reinvent Jekyll in pure R, and I believe we can do much much better than Jekyll with the power of R Markdown and Pandoc. That said, I'm afraid I cannot commit any time to this before the summer this year.

Owner

yihui commented Jan 13, 2016

@brendan-r I just want to say this is very impressive! The more I think about these issues, the more I want to reinvent Jekyll in pure R, and I believe we can do much much better than Jekyll with the power of R Markdown and Pandoc. That said, I'm afraid I cannot commit any time to this before the summer this year.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment