How can I access the value shown in the hover modal of a rickshaw graph?

Question

I have a graph using rickshaw that includes a hoverDetail, and I want to dynamically change another area of the page using JQuery based on the value that is currently being hovered over. Is this possible using rickshaw and JQuery? Or will another approach be necessary?

Answer 1

This example shows clearly how to edit the render() function of the hoverDetail object http://code.shutterstock.com/rickshaw/examples/hover.html

Instead of showing the data as a label, it is showing the data in a fixed position on the page.

var Hover = Rickshaw.Class.create(Rickshaw.Graph.HoverDetail, {

render: function(args) {

    legend.innerHTML = args.formattedXValue;

    args.detail.sort(function(a, b) { return a.order - b.order }).forEach( function(d) {

        var line = document.createElement('div');
        line.className = 'line';

        var swatch = document.createElement('div');
        swatch.className = 'swatch';
        swatch.style.backgroundColor = d.series.color;


        var label = document.createElement('div');
        label.className = 'label';
        label.innerHTML = d.name + ": " + d.formattedYValue;