rstudio / rmarkdown

Dynamic Documents for R
https://rmarkdown.rstudio.com
GNU General Public License v3.0
2.88k stars 979 forks source link

Missing plot on knitted HTML #1514

Closed leungi closed 5 years ago

leungi commented 5 years ago

Issue: plot renders in HTML preview pane in RStudio, but when opening the knitted HTML output file, it's not showing.

Below is reprex.

Look forward to advice.

---
title: Hello World
output: html_document
---

A sample document.

```{r}
library(LDAvis)
data(TwentyNewsgroups, package = "LDAvis")
phi <- TwentyNewsgroups$phi
theta <- TwentyNewsgroups$theta
doc.length <- TwentyNewsgroups$doc.length
vocab <- TwentyNewsgroups$vocab
term.frequency <- TwentyNewsgroups$term.frequency
json <- createJSON(phi, theta, doc.length, vocab, term.frequency, R = 20)

serVis(json, out.dir = here::here("rmd/test"), open.browser = FALSE)
htmltools::includeHTML("test.html")

The file test.html is in the same directory as the .Rmd file with the following content:

 <html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>LDAvis</title>
  <script src="test/d3.v3.js"></script>
  <script src="test/ldavis.js"></script>
  <link rel="stylesheet" type="text/css" href="test/lda.css">
</head>
<body>
  <p>This is an R HTML document. When you click the <b>Knit HTML</b> button a web page will be generated that includes both content as well as the output of any embedded R code chunks within the document. You can embed an R code chunk like this:</p>

  <div id = "lda"></div>
  <script>
    var vis = new LDAvis("#lda", "test/lda.json");
  </script>
</body>
</html>
yihui commented 5 years ago

When you include one .html file into another one, you should make sure this .html file is only an HTML fragment, otherwise the final HTML document will not be valid, because it will have one <html> tag nested within another like

<html>
  <head>  </head>

  <body>
  Parent HTML file.

  <!-- htmltools::includeHTML() below -->
    <html>
      <head>  </head>
      <body>
      Child HTML file.

      </body>
    </html>
  <!-- included above -->

  </body>
</html>

You should only include the portion between <body> and </body> of test.html.

leungi commented 5 years ago

Noted. Thanks @yihui !

github-actions[bot] commented 4 years ago

This old thread has been automatically locked. If you think you have found something related to this, please open a new issue by following the issue guide (https://yihui.org/issue/), and link to this old issue if necessary.