Search code examples
javascriptrickshaw

How to remove part of line in Rickshaw line graph


I have some invalid points in my data and I want to intersect line graph. Line graph is like in example: http://code.shutterstock.com/rickshaw/guide/line-2.html

var graph = new Rickshaw.Graph({
    element: document.querySelector("#chart"),
    width: 235,
    height: 85,
    renderer: 'line',
    series: [{
        data: [ { x: 0, y: 40 }, { x: 1, y: 49 }, { x: 2, y: 38 }, { x: 3, y: 30 }, { x: 4, y: 32 } ],
        color: '#4682b4'
    }, {
        data: [ { x: 0, y: 20 }, { x: 1, y: 24 }, { x: 2, y: 19 }, { x: 3, y: 15 }, { x: 4, y: 16 } ],
        color: '#9cc1e0'
    }]
});
graph.render();

I tried specifying invalid data like this:

data: [ { x: 0, y: 40 }, { x: 1, y: 49 }, { x: 2, y: null }, { x: 3, y: 30 }, { x: 4, y: 32 } ]

but it's not working.


Solution

  • Replacing d3.js from rickshaw package (v.2.5.0) with latest version of d3.js (now v.3.4.11) does exactly what I expected - removes null point with connected lines.