Table in Markdown file generated by pandoc doesn't render correctly

Hi, all,

I've been using R Markdown for a while, in order to gain a "competitive advantage" :grin: when writing posts for the company blog, because instead of having to use the blog interface, I can just write the blog post in RStudio, compile to HTML with the option of keeping the Markdown file and then load the Markdown file to the company blog, and voilà, here's my blog post!

However, lately the Markdown file produced by pandoc doesn't seem to be compatible with the company blog platform anymore. This may be due to changes in the platform, of course, but actually even the preview of Visual Studio Code doesn't render them correctly, so I'm wondering if something has changed on the R side of things...here is the original R Markdown file:

---
title: "test"
subtitle: "test"
author: "test"
date: "test"
output:
  html_document:
    keep_md: true
    fig_caption: yes
---

<style>
p.caption {
  font-size: 0.8em;
}
</style>

```{r setup, include=FALSE}
library(knitr)
library(pander)
opts_chunk$set(echo = FALSE,
               out.width = "75%", 
               fig.align = "center")
```


## Table

```{r table}
methods <- data.frame(kernel = c("RBF", "RBF", "Matern 5/2"), 
                      ARD = c("No", "Yes", "No"), 
                      RMSE = c(1.46, 1.34, 1.27))
pander(methods)
```

Here is the HTML output, after knitting to HTML: it looks great!


The Markdown file generated by RStudio (I guess, by pandoc actually) is

---
title: "test"
subtitle: "test"
author: "test"
date: "test"
output:
  html_document:
    keep_md: true
    fig_caption: yes
---

<style>
p.caption {
  font-size: 0.8em;
}
</style>




## Table


-------------------------
   kernel     ARD   RMSE 
------------ ----- ------
    RBF       No    1.46 

    RBF       Yes   1.34 

 Matern 5/2   No    1.27 
-------------------------

If I now preview this file in RStudio, it looks the same as the R Markdown file HTML output:


However, previews with other tools (Visual Studio Code and my company's blog platform, in particular) look horribly mangled:

What's happening? How can I go back to my happy days, when I could just write the blog post in RStudio and then publish the corresponding Markdown file? Less dramatically, how can I fix the Markdown code so that the table doesn't look like crap?

The answer lays buried somewhere in here:

/usr/local/bin/pandoc +RTS -K512m -RTS index.utf8.md --to html4 --from markdown+autolink_bare_uris+ascii_identifiers+tex_math_single_backslash+smart --output index.html --email-obfuscation none --standalone --section-divs --template /Users/rc/Library/R/3.5/library/rmarkdown/rmd/h/default.html --no-highlight --variable highlightjs=1 --include-before-body /var/folders/vw/p54wdfm95lq9wf8jkwxg_qpw0000gp/T//RtmpaANO6E/rmarkdown-str55c3352a136d.html --variable navbar=1 --variable body_padding=51 --variable header_padding=56 --variable 'theme:bootstrap' --include-in-header /var/folders/vw/p54wdfm95lq9wf8jkwxg_qpw0000gp/T//RtmpaANO6E/rmarkdown-str55c35d61745f.html --mathjax --variable 'mathjax-url:https://mathjax.rstudio.com/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML' 

So, the suspects are:

  1. which pandoc
  2. pandoc -v
  3. html4
  4. --template .../default.html
  5. css in or used by default.html
  6. Theme bootstrap

Once you id pandoc, I'd go to http://pandoc.org/releases.html to see if there's any obvious changes that affect rendering.

I'd do the same for where ever the bootstrap theme is to be found and check for changes in css both the RStudio environment and your target environment.

I took the markdown file, ran it through pandoc 2.5 and came up with a vanilla, barebone css html5 file that renders on safari as

50%20PM

I think that narrows it to which version of pandoc is first in your path and that the process by which your markdown is processed on your company platform is adding css with different expectations than what you're giving them.

1 Like

Hi, technocrat,

thanks for the anwer!. I tried to follow your suggestions, but without success. When I knit to HTML, I see:

/Applications/RStudio.app/Contents/MacOS/pandoc/pandoc +RTS -K512m -RTS test.utf8.md --to html4 --from markdown+autolink_bare_uris+ascii_identifiers+tex_math_single_backslash --output test.html --smart --email-obfuscation none --self-contained --standalone --section-divs --template /Library/Frameworks/R.framework/Versions/3.5/Resources/library/rmarkdown/rmd/h/default.html --no-highlight --variable highlightjs=1 --variable 'theme:bootstrap' --include-in-header /var/folders/6m/3vm9vws14tzb0nyh0yldv56r0000gn/T//RtmpLo1CMb/rmarkdown-str7d0770682313.html --mathjax --variable 'mathjax-url:https://mathjax.rstudio.com/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML'

If I execute

which pandoc

I get

/anaconda2/bin/pandoc

And correspondingly,

pandoc -v

gives

pandoc 2.2.3.2
Compiled with pandoc-types 1.17.5.1, texmath 0.11.0.1, skylighting 0.7.2
Default user data directory: /Users/andreapanizza/.pandoc
Copyright (C) 2006-2018 John MacFarlane
Web:  http://pandoc.org
This is free software; see the source for copying conditions.
There is no warranty, not even for merchantability or fitness
for a particular purpose.

However, this is not the version of pandoc which RStudio uses to knit .Rmd files. The version used by RStudio is

/Applications/RStudio.app/Contents/MacOS/pandoc/pandoc -v
pandoc 1.19.2.1
Compiled with pandoc-types 1.17.0.4, texmath 0.9, skylighting 0.1.1.4
Default user data directory: /Users/andreapanizza/.pandoc
Copyright (C) 2006-2016 John MacFarlane
Web:  http://pandoc.org
This is free software; see the source for copying conditions.
There is no warranty, not even for merchantability or fitness
for a particular purpose.

Looking at http://pandoc.org/releases.html#pandoc-1.19.2.1-31-jan-2017, I read

pandoc 1.19.2.1 (31 Jan 2017)

  • Require skylighting >= 0.1.1.4.
  • Adjust test output for skylighting version.
  • Relax upper bounds on blaze-html and blaze-markup.

I don't understand a lot of this message, but I don't think rendering is affected. Anyway, updating conda in order to update pandoc, doesn't affect the pandoc version used by RStudio, thus I don't see how I can fix this...Ah, BTW:

my issue is not with the HTML file generated by RStudio: that one is fine, and renders nicely in Safari. My problem is that the .md file, once previewed through any tool except RStudio, doesn't look anything like the nice HTML file...

Thanks for chasing down the possibilities. I'll try to reconstruct how it was that I got iStudio to use my /local/usr/bin of pandoc (I'm not sure that solves your problem, but if RStudio is that far behind on Pandoc, things are going to start breaking.

What I did with your markdown (not html) was to render it through pandoc's online converter, then wrap it in standard header/footer without any css additions or tweaking. That's the screenshot. RStudio produces markdown that can be correctly rendered in any browser unless it's being filtered through an hugo or jekyll type renderer into a template that is looking for more choices. I don't use VS or, of course, your in-house platform. I'll look at the RStudio (current version) to see if I can find how to reset the pandoc path

1 Like

RStudio looks for the first pandoc in your $PATH See https://support.rstudio.com/hc/en-us/community/posts/239075008-pandoc

Using pandoc conversion of the markdown file to html produces identical results in Safari, Chrome and Firefox

$ 506:  /usr/local/bin/pandoc -v
pandoc 2.5
Compiled with pandoc-types 1.17.5.4, texmath 0.11.1.2, skylighting 0.7.4

pandoc-types is a pandoc internal Haskell thing. texmath should have no effect on what your example does and skylighting is just syntax highlighting.

In years using it I can't think of anything major that pandoc has ever broken with a new release.

What the downstream systems do with RStudio markdown or html remains a mystery.

1 Like

Hi technocrat, thanks again for the answers. I need a little time to understand all your info, but once I’m done I’ll get back to you.

Hi, Richard,

the converter is this one, right? https://pandoc.org/ I repeated your experiment, without "wrapping it in standard header/footer" (because I wouldn't know how to do it, I know little about HTML), and this is what I got:

https://pandoc.org/try/?text=---%0Atitle%3A+%22test%22%0Asubtitle%3A+%22test%22%0Aauthor%3A+%22test%22%0Adate%3A+%22test%22%0Aoutput%3A%0A++html_document%3A%0A++++keep_md%3A+true%0A++++fig_caption%3A+yes%0A---%0A%0A%3Cstyle%3E%0Ap.caption+%7B%0A++font-size%3A+0.8em%3B%0A%7D%0A%3C%2Fstyle%3E%0A%0A%0A%0A%0A%23%23+Table%0A%0A%0A-------------------------%0A+++kernel+++++ARD+++RMSE+%0A------------+-----+------%0A++++RBF+++++++No++++1.46+%0A%0A++++RBF+++++++Yes+++1.34+%0A%0A+Matern+5%2F2+++No++++1.27+%0A-------------------------&from=markdown&to=html5

Saving the resulting file as test2.html and opening it with Chrome definitely shows a nice table, as you found out:

Thus, it looks like pandoc 2.5 works correctly, at least from the online editor. I'll try to modify the $PATH variable as you suggest

and check if pandoc 2.2.3...., launched from RStudio, works the same (this is the latest version I could install, through Anaconda). I'll let you know about the results.

PS I had to dot the last digit of the version number, if you want to know why you can DM me.

1 Like

I'm sorry to have assumed so much; I've been coding html since it had to be done by hand.

In the case of the markdown output either through pandoc locally or the pandoc.org site you correctly identified, the minimum html file is

<!DOCTYPE html>
<html>
<head> # optional
	<title></title> 
</head>
<body>
# your markdown output here
</body>
</html>

That's all there is to it, until you start bringing in css files, which is where it gets fun, and what makes me thing that it plays a role in your rendering problems

1 Like

The first pandoc in my $PATH is the Anaconda one, but RStudio is happily ignoring it. I created a new topic:

Let's see if someone knows how to fix this.

This topic was automatically closed 21 days after the last reply. New replies are no longer allowed.