ramnathv / rCharts

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

clickme and rCharts integration #39

Closed timelyportfolio closed 11 years ago

timelyportfolio commented 11 years ago

@nachocab will be the most helpful in this discussion, but I know he is buried in PHD stuff currently. I'll try to comment based on my own understanding of the spirit of clickme. In terms of create_chart, this almost replaces clickme for this limited functionality in that

 {{ create_chart(file.R) }} 

could be the entire template.Rmd. This might be still be in the spirit of clickme if you added the ability to pass parameters in create_chart like

{{ create_chart(file.R, {{opts$data}} ) }}

but I think is is a stretch.

Rather I think the more useful function to integrate clickme and rCharts is the method

$printChart()
$html()

as this allows us to include the div+script or the script in a template.Rmd through a {{ functiontorun_rCharts(opts) }} type call. I will work on a minimal example and hope to post in the next 30 minutes.

nachocab commented 11 years ago

I am indeed in the middle of PhD hell, but I'll get back to Clickme in a week :) @ramnathv I like what you're doing with rCharts. I think our approaches are complementary, so I'd love to make both packages inter-operable.

ramnathv commented 11 years ago

I see a lot of potential here as well. Clickme can benefit from some refactoring, since there is repeated code across the the templates, and across data translators. Given that d3.js uses a limited amount of data structures, it might make sense to just have a bunch of translators, and shift the innovation to the templates.

Effectively, it should be possible to just have a single Rmd file with YAML front matter representing the config and the javascript function in the body. The YAML front matter can take scripts and styles as a list of external asests.

Another way to go about this is to think of a clickme as a highly specialized library. Taking that route makes things simpler, since config.yml can map to the YAML configuration and layouts/chart.html can map to.

ramnathv commented 11 years ago

Here is forcedirected implemented in rCharts

require(RCurl)
dat = read.csv(text =   getURL('https://raw.github.com/nachocab/clickme/master/inst/examples/force_directed/data/original_data.csv'))
dat = toJSONArray(dat, json = F)

p1 <- rCharts$new()
p1$field('lib', 'forcedirected')
p1$set(x = 'source', y = 'target', type = 'type', data = dat)
p1
ramnathv commented 11 years ago

Some explanation is in order. Here is what I am doing

  1. We initialize a new instance of the class rCharts
  2. I set the lib field manually to forcedirected so that it will now look for everything in inst/forcedirected
  3. I have to use x and y since rCharts needs them by default. But, you can map it to any name, as I have done in my code here. You can also use arbitrary field names, but x and y are a must. This is necessary to be able to take advantage of the formula interface as well.
  4. Finally, we print the chart.

Note that I used toJSONArray to convert the data frame into a JSON Array, rather than a JSON object, which is what toJSON would do. This is similar to what df2json would do. I use json = F, because I want the R object. rCharts by default converts its payload to JSON, so that would be taken care of automatically.

timelyportfolio commented 11 years ago

Here is my simple example. Where clickme can be extremely helpful is combining multiple charts and also potentially adding the javascript interactive functions and components. Correct me if I am wrong but rCharts excels at creating a single chart. These can be combined in a ractive to create a powerful whole.

This example I think helps highlight some of the data duplication.

ramnathv commented 11 years ago

What you are doing can be achieved using Slidify and rCharts. I will post an example shortly.

UPDATE. Here you go http://ramnathv.github.io/rChartsPerfAnalytics/

timelyportfolio commented 11 years ago

very nice!

Some questions though as I still wrestle with the differences of rCharts and clickme.

What happens though when we want to loop through 40 managers and produce this for each with this as our content template? clickme allows us to simply do

clickme(get(paste0(manager,i)), ractivename)

Also what happens if we want to combine the charts into one group for interactivity, such as when we hover over an area in the cumul chart, we want a vertical line to appear on both charts representing the x location and trigger the appearance of a tooltip? clickme would allow us to provide the functionality in the template.Rmd.

ramnathv commented 11 years ago

I just added a Shiny app too. You can either try it by downloading the repo or use

runGitHub('rChartsPerfAnalytics', 'ramnathv', ref = 'gh-pages', subdir = 'app')

This should answer your question about multiple managers :)

timelyportfolio commented 11 years ago

now we are talking! sweet! @jfreels

timelyportfolio commented 11 years ago

did you manually or programatically produce?

ramnathv commented 11 years ago

I have an idea to programmatically produce it :-). For now, I just cut paste code.

Basically

  1. global.R all data prep code
  2. ui.R interface for manager selection + two outputs
  3. server.R cut-paste code for the two charts, replacing 1 with input$manager.

I was thinking of writing up a shinify function that would create a shiny rCharts app, given a bunch of inputs. It should not be too difficult.

I tried your clickme version. I don't see any interactivity there. Am I missing something?

ramnathv commented 11 years ago

I have some ideas on clickme and rCharts integration. Essentially, I can reprogram rCharts such that a clickme type of folder can make use of the rCharts class. Once that happens, clickme users can benefit fully by all the supporting functions including publish.

However, for that to happen, design changes are required at both ends. If you see my forcedirected example, you will see what I am talking about. I am happy to talk through this with @nachocab and see where this leads. For starters, I will convert a few more clickmes into a structure that rCharts can take. We can iterate to arrive at a design that works for everyone (hopefully!)

timelyportfolio commented 11 years ago

so what did you copy for the forcedirected example? was it the ractive?

nachocab commented 11 years ago

I am totally willing to do this. I love the publishing feature. My goal is to make interactive plots as easy to use as static plots. I'm not married to any tool or library (not even my own). Give me a week until I pass my qualifying exam, so I have some free time and let's talk about it.

ramnathv commented 11 years ago

The structure of a library in rCharts (which is essential for it to seamlessly integrate as a widget in Slidify) is as shown below. config.yml provides metadata about scripts and styles (and other info). layouts contains a chart.html which is just a mustache template with javascript. The js and css folders are self explanatory.

lib
  config.yml
  layouts
    chart.html
  js
  css

In the case of the forcedirected ractive,

  1. I replaced js and css with external (since it only matters for how they are referred to in config.yml).
  2. I modified template.Rmd by stripping everything other than the js within script tags. rCharts only passes a single js object by default called chartParams. I captured it in the JS variable params and then modified the js function. My idea is not to have any placeholders in the JS function, and essentially use R to direct the payload. This will be clearer once I post more clickme examples formatted for rCharts.

You can see the final structure here.

Good luck with your qualifiers @nachocab. Let us talk once you are done with that. I know how qualifiers can hang over your head :) Meanwhile, I will post more examples of integrating ractives. We will need a few iterations, but I can totally see how they will work great.

timelyportfolio commented 11 years ago

forcedirected worked very nicely, and I hope to run many more experiments. On a side note, the publish feature worked great.

timelyportfolio commented 11 years ago

Now I believe I understand enough to play along. Let me know as soon as you have one or two more examples, so I can get right on it. Thanks.

ramnathv commented 11 years ago

@timelyportfolio @nachocab Another example: Parallel Coordinates

http://ramnathv.github.io/rChartsParCoords/

ramnathv commented 11 years ago

Here is a version published using the publish method

http://pagist.github.io/?5448776

timelyportfolio commented 11 years ago

alright I'm pretty dang convinced. Well done! I will do all the standalone polycharts, but what next? Still want me to focus on NVD3? I'm not the biggest fan of NVD3 but it does offer some of the best built-in interactivity.

ramnathv commented 11 years ago

I want to take a step back and revisit the design of rCharts to see what changes are needed to more flexibly accomodate clickme style charts. I also want to refactor, adhere to a consistent naming policy and follow a coding style.

I think you should try to do what excites you. Feel free to bounce ideas around.

ramnathv commented 11 years ago

rChartsExtra will house custom visualizations.

nachocab commented 11 years ago

Good to hear!

ramnathv commented 11 years ago

Thanks. rCharts was getting too dense to hold everything, so I decided to spin-off custom visualizations into an rChartsExtra. Nice zoomable scatterplot with clickme btw.

nachocab commented 11 years ago

Thanks, more are coming. Good luck presenting on the NYC R meetup.

ramnathv commented 11 years ago

Great. Look forward to seeing more! And thanks.