ramnathv / rCharts

Interactive JS Charts from R
http://rcharts.io
Other
1.19k stars 655 forks source link

Problems with nPlot addControls / addFilters #392

Open jarmo-kauko opened 10 years ago

jarmo-kauko commented 10 years ago

Great job with rCharts, I'm really enjoying it :+1:

I'm using RStudio (0.98.741) preview release with new R Markdown to generate a standalone website, as described here. I want to use 'inline' nvd3 charts so that .js libraries and stylesheets are used from a shared libs folder.

Here are a few problems I encountered:

  1. Adding controls creates html with indent, which pandoc interprets as preformatted code block.
  2. <div id='...' class='rChart'> is generated twice: once by template$chartDiv and once from lib/controls/script.html.
  3. Having multiple charts with controls doesn't work, as all angular controllers have the same name (DemoCtrl).

To create a standalone test case, I included scripts and styles directly to RMarkdown:


---
title: "rCharts NVD3 plots"
output:
  html_document:
      self_contained: false
      lib_dir: libs

---

<link rel='stylesheet' href=http://nvd3.org/assets/css/nv.d3.css>
<script type='text/javascript' src=http://d3js.org/d3.v3.min.js></script>
<script type='text/javascript' src=http://timelyportfolio.github.io/rCharts_nvd3_tests/libraries/widgets/nvd3/js/nv.d3.min-new.js></script>
<script type='text/javascript' src=http://nvd3.org/assets/lib/fisheye.js></script> 

<script type='text/javascript' src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js"></script>
<script type='text/javascript' src="http://cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.min.js"></script>
<style>
  .rChart {
    display: block;
    margin-left: auto; 
    margin-right: auto;
    width: 800px;
    height: 400px;
  }
</style>

<div ng-app>

## addControls

```{r results = 'asis', comment = NA, cache = F}
library(rCharts)
n1 <- nPlot(mpg ~ wt, data = mtcars, group = "gear", type = "scatterChart")
n1$addControls("x", value = "wt", values = names(mtcars))
n1$addControls("group", value = "gear", values = names(mtcars))
n1$show('inline', include_assets = FALSE)

addFilters

n1 <- nPlot(Freq ~ Hair, group = 'Eye', data = as.data.frame(HairEyeColor), type = 'multiBarChart')
n1$addFilters("Sex")
n1$show('inline', include_assets = FALSE)



I can provide a pull request with quick fixes if you like.
arturochian commented 10 years ago

I have the same problem, I think this issue is related to the last update of rChart and Markdown package. I'm going to install last Rstudio in order to visualize the markdown file this sunday. I don't know if I can't see the graphics because I'm not using the last version of Rstudio.

1

ramnathv commented 10 years ago

R Markdown has introduced a new system of html widgets. Once I implement that, including charts inline should be easier. The angularjs piece is also being refactored to be more functional and support multiple controllers. I am leaving this issue open to serve as a reminder.

arturochian commented 10 years ago

This sounds cool!!. I could put addcontrols in a markdown and slidify but in this version I can't. @ramnathv could you tell us how to put a html file into Rmd (sorry I don't remember)... I'm going to try understand the difference between this version of rChart and the previous one and if I could, I'd help you. I'm a undergrade student of economics and I have a some experience programming...

jarmo-kauko commented 10 years ago

@ramnathv Sounds great, keep us updated how it goes. I'd like to test it out as soon as you have something working.

@arturochian With quite small changes, I was able to get multiple inline charts with controls working. Check my PR if you want to try it out.