cis-ds / course-site

Course site for Computing for Information Science (INFO 5940)
43 stars 41 forks source link

Convert all image embeds in content folder to use knitr::include_graphics() #265

Closed bensoltoff closed 2 years ago

bensoltoff commented 3 years ago

Allows for proper headers and sizing. Easy, but tedious

djanvier commented 3 years ago

I just did a first past of replacing all the images with knitr::include_graphics() and wanted to double check something. In the two or three cases where knitr::include_graphics() was already used, I noticed you opted for:

# static folder NOT in filepath
knitr::include_graphic(path = "/img...", error = FALSE

Whereas I used

# static folder in filepath
knitr::include_graphics(path = "static/img..."

Do both work or should I change mine?

djanvier commented 3 years ago

Also, I noticed you set other code chunk options in that case (fig.align='center' and out.width="85%"). Do I need to do this as well?

bensoltoff commented 3 years ago

@djanvier I used

knitr::include_graphic(path = "/img...", error = FALSE)

because of how include_graphic() generates the relative filepath. All the images are currently stored in the static/img folder, but Hugo (the web site generator program) automatically copies the contents of static into the top-level directory of the web site. So in the web pages, you must reference the img/ folder directly.

The problem is that when you knit the page, knitr is still using the current working directory to build relative filepaths and based on that you do need to include static in the filepath (this is like advanced tier file paths). Hence I also omit the use of here::here() since in the conversion from RMarkdown to Markdown to HTML, that will build an incorrect filepath.

include_graphics() will check to see if the file specified in path exists. If it does not, it generates an error. Normally this is a good thing, but with blogdown we are specifically referencing a file in its "incorrect" location. So error = FALSE is necessary to prevent this error. This issue documents the conundrum thoroughly.

Long story short is I believe you need to use the my approach above, otherwise you run into problems.

bensoltoff commented 3 years ago

As for the knitr options fig.align='center' and out.width="85%", I think that occurred once where I was adapting source code from another site to construct those notes. It is not necessary to implement that for all the image embeds.

djanvier commented 3 years ago

@djanvier I used

knitr::include_graphic(path = "/img...", error = FALSE)

because of how include_graphic() generates the relative filepath. All the images are currently stored in the static/img folder, but Hugo (the web site generator program) automatically copies the contents of static into the top-level directory of the web site. So in the web pages, you must reference the img/ folder directly.

The problem is that when you knit the page, knitr is still using the current working directory to build relative filepaths and based on that you do need to include static in the filepath (this is like advanced tier file paths). Hence I also omit the use of here::here() since in the conversion from RMarkdown to Markdown to HTML, that will build an incorrect filepath.

include_graphics() will check to see if the file specified in path exists. If it does not, it generates an error. Normally this is a good thing, but with blogdown we are specifically referencing a file in its "incorrect" location. So error = FALSE is necessary to prevent this error. This issue documents the conundrum thoroughly.

Long story short is I believe you need to use the my approach above, otherwise you run into problems.

That makes a lot of sense. Thank you for clearing this up! I will making these changes asap.