Idiomatic d3.js JavaScript

idiomatic-d3js.mdown

Assigning Variables

When assigning variables, instead of doing this:

var r = 3;
var h = 5;
var l = 10;
var padding = 15;

do this:

var r = 3,
    h = 5,
    l = 10,
    padding = 15;

Using attr()

Instead of doing this:

.attr("x", function(d) {
    return xScale(d[0]);
})
.attr("y", function(d) {
    return yScale(d[1]);
})
.attr("font-family", "sans-serif")
.attr("font-size", "11px")
.attr("fill", "red");

do this:

.attr({
    "x": function(d) {
        return xScale(d[0]);
    },
    "y": function(d) {
        return yScale(d[1]);
    },
    "font-family": "sans-serif",
    "font-size": "11px",
    "fill": "red"
});