1

I am working on a personal website using blogdown. I know about the handy addin for inserting an image - it works well, but for only one image. Is there a way, using knitr::include_graphics, to insert multiple images side-by-side?

I'm aware of using something like this: ![image text](path/to/image.png) ![other image text](path/to/image2.png)

But this cannot adjust the size of each image, which is an important formatting option for me.

Note:
While poking around for a solution before I post this question, I found this github issue which seems to be similar to what I'm talking about.

Edit:
Using something like this: <img src="path/to/image.png" width="50%"/><img src="path/to/image2.png" width="50%"/> Was suggested, but it only displays the images on top of each other in the document.

JDurbs
  • 25
  • 1
  • 8
  • Would a solution like this suffice to you? `` – Emi Nov 20 '18 at 00:39
  • 1
    @Emi I edited the question. This suggestion displays the two images top - bottom, instead of side - by - side. I would also prefer a way to accomplish this using a r chunk. – JDurbs Nov 20 '18 at 04:47
  • I find it helpful to do the image layout in a code chunk as well. checkout this answer: https://stackoverflow.com/a/37382305/7503413 – TC Zhang Nov 20 '18 at 05:10
  • Another way for precise control of the layouts on a webpage(not only images!) is to learn the html+css syntax, as suggested by Emi. If her code doesn't work, try a different width, like "45%". – TC Zhang Nov 20 '18 at 05:14
  • @TCZhang, I did try the `` solution, but even with `width="10%"`, it doesn't work. Using the solution you suggested gives me the following error: `Error in readPNG("path/to/image1.png") : unable to open path/to/image.png` (replacing "path/to/image1.png" with my own path) It's possible I have my path set up incorrectly, blogdown can be tricky with path names. I did try many different path names, however. – JDurbs Nov 20 '18 at 15:53
  • In this case, you can try this: a. upload your image to imgur, then link the URL. b. use the absolute full path(e.g. `readPNG("/home/aaa/b.png")`) to your image, and run the code chunk to see if the image can be correctly rendered. – TC Zhang Nov 21 '18 at 01:23

1 Answers1

0

I'll post the solution mentioned in the above comments since it worked the best for me, and I'll certainly come back to this post to use this in the future. The answer here seems to be the only thing that works for me. If getting the path name correct is difficult, run the command getwd() in the line above to make sure readPNG is looking in the right place.

JDurbs
  • 25
  • 1
  • 8