Question

I want to create a path with d3.js that has dates for the x-axis. This is working perfectly, but my problem is, that my json-object isn’t sorted so that the path is not correct:

I couldn’t find a function that sorts my data – or do I have to write one by my own? If yes, I would try it but if there is another possibility.. 😉

            var line = d3.svg.line()
                .interpolate("linear")
                .x(function(d) { return x(d.finished_at); })
                .y(function(d) { return y(d.result); });

            svg.selectAll("path")
                .data(data)
            .enter().append("path")
                .attr("class", "line")
                .attr("d", line(data));

Has anyone an idea? Thanks!

Answer 1

Have you looked at d3.ascending?
https://github.com/mbostock/d3/wiki/Arrays#wiki-d3_ascending

or you can do this…

Sorting a selection in d3.js disturbs the data-join