The recomended way to include existing images in bookdown is using knitr::include_graphics.
For example, to put two images side by side code will be something like:
```{r myfigure fig.show='hold', fig.align='center', out.width='50%', fig.cap = ""}
fig1_path <- paste0(fig_path,"image1.png")
fig2_path <- paste0(fig_path,"image2.png")
knitr::include_graphics(c(fig1_path, fig2_path))
```
However, this produces html and latex where the images are very close each other. It would be desirable to add some space/padding/margin between to look better.
For the html case, this is easy to fix because we can add some external css to control the space. However, for the latex output i don't have any decent solution yet.
Im thinking a portable workaround could be to add an extra empty image between or add lateral space to both images, but i prefer to hear better suggestions.
Related
I am trying to place side by side images in r markdown beamer using the code below.
```{r, out.width='.49\\linewidth', fig.cap='caption', fig.show='hold', fig.align='default'}
knitr::include_graphics(c('figures/yield.png', 'figures/boxplot_yield.png'))
However, the images somehow were vertically stacked, instead of horizontally. Please see the resulted plot below. Any ideas??
When I ran your code with my own pictures, they rendered side by side, you may need to make the pictures a smaller resolution and then your code should do what you want
When writing an xaringan slide using .pull-left[] and .pull-right[], the left side changes the position of the objects with incremental slides --. This looks poor if you want to discuss the content on the left as it moves when the text is addeed (see pictures attached). Is there a way in-line or in css to stop this happening so, for example in this case, the shiny.png stays still in the center of the left column when the text is incredmental text is added to the right:
class: middle
.pull-left[
\```{r Shiny, echo=FALSE, out.width="100%", fig.align='center'}
knitr::include_graphics("img/Shinyexample.png")
\```
]
--
.pull-right[
### Shiny
- Shiny is an R package that makes it easy to build interactive web apps straight from R.
- You can host standalone apps on a webpage or embed them in R Markdown documents or build dashboards.
- You can also extend your Shiny apps with CSS themes, htmlwidgets, and JavaScript actions.
]
This is a two-part question, both parts are probably simple:
Why do my comments appear between the code and the output? I'd rather it display as I type it. For instance:
Gives the output:
But I would prefer the "We have 7 classes of data..." line to go above the code in the PDF.
Using the second picture from above, why does the gray box containing the code in have a larger border above the code than below? I'd rather the top have the same size border as the bottom.
I'm assuming this is an easy setting to change but I can't figure it out.
I'm trying to use the knit2wp() function of knitr in order to blog to Wordpress as discussed here: http://yihui.name/knitr/demo/wordpress/
My problem is that, despite trying various options to control chunk width, including setting tidy.opts in the chunk options, and adjusting global width settings as seen here, my R code chunks won't wrap around, resulting in overly wide code chunks that require scrolling sideways to view them, like this.
Is there a setting that I'm missing that will cause R code chunks to wrap around? Also, is there a setting that will widen the grey boxes that appear in Wordpress for the code chunks? None of the width options seem to have any effect.
This is what my setup chunk currently looks like:
```{r setup, echo=FALSE}
library(knitr)
opts_knit$set(upload.fun = function(file) imgur_upload(file, key = "xxxx"))
opts_chunk$set(fig.width=5, fig.height=5, fig.align = 'center', cache=TRUE, tidy = FALSE)
````
I have also tried adding the line options(width = 80) to that chunk, as well as setting tidy.opts within each chunk, and none of these has had any effect.
As a dirty fix, you may add word-wrap: break-word; in css file to your pre element. Or embed it to a html file.
EDIT1:
Final advise is on the bottom. I am not an expert in WP, so you will have to work out the solution yourself.
As for how it will look, you may try it in a browser. There is an example with this page. You choose the element and may see a style on left. You may fix it in your browser (Right click, then "Inspect element" in Chrome) to see how it will look. However, this is not a permanent change: you change your local version. Refresh the page to get back to original.
Now I turn word wrapping off (better change it to break-word):
If you satisfied with result of in-browser if, there are to options to make change it in server:
If we play dirty anyway, you may embed the style tag into your template somewhere. Wrap it in a style tag (Editor removes them, so i am not able to post it):
pre {word-wrap: break-word}
Edit you css and either create a new class or fix the ones that you have. I ma not sure how to do it with wordpress, but there is some information here: https://wordpress.org/support/topic/how-to-edit-css-style-sheet
I believe that the right approach is the second, but if you want result ASAP, you may try the first one as it looks easier.
I want to include an svg image in an .Rmd document. The svg is created using the RSVGTipsDevice package as I want the image to have some tooltips. The problem is that after the image has been included into the generated HTML document, the tooltips do not work anymore. Although they work properly when I open the svg in a browser (link to image, hover over red rectangle to see the tooltip).
http://www.gridhub.uni-bremen.de/public/pics/plot.svg
Here is the complete .Rmd code:
```{r}
library(RSVGTipsDevice)
devSVGTips("plot.svg", toolTipMode=1)
plot(0, type="n")
setSVGShapeToolTip("A rectangle","it is red")
rect(.1,.1,.4,.6, col='red')
dev.off()
```
The question is: How can I make the tooltips work?
Does my comment help? To be clear, the  portion becomes <img src="plot.svg"> which is not a proper way to include svg. To prove this works, I've provided the source and its output.