score:4

Accepted answer

The multi renderer feature was added about a month ago. This example shows how to combine several renderers in one chart. The relevant code of the example:

var graph = new Rickshaw.Graph( {
    element: document.getElementById("chart"),
    renderer: 'multi',
    width: 900,
    height: 500,
    dotSize: 2,
    series: [
        {
            name: 'temperature',
            data: seriesData.shift(),
            color: 'rgba(255, 0, 0, 0.4)',
            renderer: 'stack'
        }, {
            name: 'heat index',
            data: seriesData.shift(),
            color: 'rgba(255, 127, 0, 0.4)',
            renderer: 'stack'
        }, {
            name: 'dewpoint',
            data: seriesData.shift(),
            color: 'rgba(127, 0, 0, 0.3)',
            renderer: 'scatterplot'
        }, {
            name: 'pop',
            data: seriesData.shift().map(function(d) { return { x: d.x, y: d.y / 4 } }),
            color: 'rgba(0, 0, 127, 0.4)',
            renderer: 'bar'
        }, {
            name: 'humidity',
            data: seriesData.shift().map(function(d) { return { x: d.x, y: d.y * 1.5 } }),
            renderer: 'line',
            color: 'rgba(0, 0, 127, 0.25)'
        }
    ]
});

Related Query