rCharts rNVD3 tooltip customisation

Question

I have the following problem; I am using the rCharts wrapper around NVD3 to produce a simple line chart. I wish to modify the default tootip behavior. Using the NVD3 library I have been able to do this with the following code;

.tooltipContent(function(key,x ,y,e,graph){
    var idx = x.replace("s","")

    var thumbPath = 'snap_' + idx + '.png'
    return '<h3>' + key + '</h3>' +
    '<p>' +  y + ' at ' + x + '</p>' +
    '<img src="'+ thumbPath+ '" alt="some_text">'
  })

This shows different thumbnails for different values of the x label. My question is as follows; Is it possible to implement the above with rCharts as it stands or will I have to modify the source?

Ovoviviparous

Answer 1

Here is a minimal example on how to specify a tooltip in rCharts for NVD3. Any JS literals you want to pass from R, including JS functions need to be wrapped between #! and !# tags so that R knows not to convert them into strings during conversion to JSON. The chart output can be seen here http://rcharts.io/viewer/?5948336

require(rCharts)
n1 <- nPlot(mpg ~ wt, group = 'gear', data = mtcars, type = 'scatterChart')
n1$chart(tooltipContent = "#! function(key, x, y){ 
  return 'x: ' + x + '  y: ' + y 
} !#")

In general, any chart method chart.x(y) translates to n1$chart(x = y) in rCharts, with y being decorated with tags if required.

Hope this helps.

Oriole

Thanks for a quick response Ramnath. Love the library! – Ovoviviparous

Great! You can post any issues you have on the github page for rCharts as well. – Oriole

I will be sure to do that in future! – Ovoviviparous

Thanks Ramnath! Can't find answer on github.com/ramnathv/rCharts/blob/master/demo/nvd3.R, is it possible to add more examples in the demo. – Mantilla

@Ramnath: Looks like some link rot at rcharts.io/viewer/?5948336 – Fluctuate