1

For the following slidify deck,

---
title       : Foo
framework   : revealjs        # {io2012, html5slides, shower, dzslides, ...}
revealjs    : {theme: solarized}
highlighter : highlight.js  # {highlight.js, prettify, highlight}
hitheme     : tomorrow      # 
widgets     : []            # {mathjax, quiz, bootstrap}
mode        : selfcontained # {standalone, draft}
ext_widgets : [libraries/nvd3]
---
## NVD3 Plot Iframe
```{r nvd3plot2, results = 'asis', comment = NA, message = F, echo = F} 
require(rCharts)
n1 <- nPlot(mpg ~ wt, data = mtcars, type = 'scatterChart')
n1
```

I want to set the background color of the chart to white.

I can do this if I knit it and then edit the <style> block in the generated figure/nvd3plot2.html to add background-color: white;:

<style>
.rChart {
  display: block;
  margin-left: auto; 
  margin-right: auto;
  width: 800px;
  height: 400px;
  background-color: white;
}  
</style>

How do I do this from the .Rmd file?

Jonathan Gilligan
  • 701
  • 1
  • 5
  • 21
  • The default background is white. Any reasons you want to set it explicitly to white? – Ramnath Jan 13 '14 at 00:42
  • When I use it with revealjs under Firefox 26.0, the chart renders with the revealjs slide background color for the background, not white. This means that if I'm putting a chart on a revealjs deck that has a dark theme (such as the default theme: remove the `revealjs : {theme: solarized}` from the deck above), I can't see the chart very well because it's black lines on a dark background. – Jonathan Gilligan Jan 13 '14 at 01:17
  • I just checked under Chrome 31.0 and got the same thing: the chart does not render with a white background by default in a revealjs deck. I have to manually add the background-color: white to get that behavior. – Jonathan Gilligan Jan 13 '14 at 01:24
  • I should have mentioned: I'm using the dev branch of slidify and rcharts and slidifyLibraries. – Jonathan Gilligan Jan 13 '14 at 01:26
  • 1
    A quick fix would be to add the following to your Rmd file ``. Personally, I prefer a transparent background so that the plot blends into the slide. – Ramnath Jan 13 '14 at 01:46
  • Perfect. That does it. Thanks. I'm just a newb trying to figure things out, and I really appreciate your help. – Jonathan Gilligan Jan 13 '14 at 02:07
  • You are welcome. I posted my comment as an answer. You may accept it so that the question is closed. – Ramnath Jan 13 '14 at 02:15

1 Answers1

2

As indicated in my comment, a quick fix to get a white background is to add the following lines to your Rmd file

<style>iframe{background-color: white}</style>
Ramnath
  • 54,439
  • 16
  • 125
  • 152