Database Reference
In-Depth Information
width is set when the rectangle is added because it does not change during
the course of visualization. This results in a dashboard, implemented in
dashboard/public/javascripts/d3.j s and dashboard/views/
d3_ex1.jade like the one shown in Figure 7.7 :
[[OPEN-LW-CODE80]] var update =
svg.selectAll("rect").data(values);
//Add a new rectangle for each piece of data
update.enter().append("rect").attr("width",dim.width/
(dataLen-1))
update
.attr("x", function(d,i) { return i*dim.width/
(dataLen-1); })
.attr("y", function(d) { return dim.height -
dim.height*(d/max); })
.attr("height", function(d) { return
dim.height*(d/max); })
});
[[CLOSE-LW-CODE80]]
Figure 7.7
Tore-createsomethinglikethelinechartfromtheoriginalcanvasexamples,
a different approach is required. In this case, a single element (the path)
should be bound to the entire data array. The only time there would be
multiple path elements would be if there were multiple series to be
 
 
Search WWH ::




Custom Search