|
Checkout this branch of d3: https://github.com/mbostock/d3/commits/map
https://github.com/mbostock/d3/pull/179 We're working on this syntax for: style, classed, property, on, attr, attrTween, style, styleTween. It's a more concise syntax, especially when the attrs are functions. An example from the tutorial: d3.select(this).selectAll("rect")
.data(function(d){return d;})
.enter().append("svg:rect")
.attr("fill", "aliceblue")
.attr("stroke", "steelblue")
.attr("stroke-width", "1px")
.attr("width", function(d, i){return (histoW/dataset[0].length)+"px"})
.attr("height", function(d, i){return (d/dataMax[rectIdx]*histoH)+"px"})
.attr("x", function(d, i){return i*(histoW/dataset[0].length)+"px"})
Becomes: d3.select(this).selectAll("rect")
.data(function(d){return d;})
.enter().append("svg:rect")
.attr(function(d,i ) {
return {
"fill": "aliceblue",
"stroke": "steelblue",
"stroke-width": "1px",
"width": (histoW/dataset[0].length)+"px",
"height": (d/dataMax[rectIdx]*histoH)+"px",
"x": i*(histoW/dataset[0].length)+"px"
};
});
Three anonymous functions become a single function which returns an object. |