+svg = d3.select "body"

+      .append "svg"

+svg.attr "width", 300

+   .attr "height", 300

+bg = svg.append "rect"

+bg.attr "width", 300

+  .attr "height", 300

+  .style "fill", "#eef"

+g = svg.append "g"

+g.attr "id", "parent"

+ .attr "transform", "translate(30,30)"

+

+t1 = g.append "text"

+t1.style "dominant-baseline", "text-before-edge"

+  .text "some text"

+

+r1 = g.append "rect"

+r1.attr "height", 32

+  .attr "width", 200

+  .style "fill", "red"

+  .style "opacity", 0.75

+            

+t2 = g.append "text"

+t2.attr "x", 0 

+  .attr "y", 0

+  .style "dominant-baseline", "text-before-edge"

+  .text "some other text"

+

+g.selectAll("*")

+    dx = 0

+    dy = 0

+    this.each( -> 

+        el = d3.select this

+        if direction == "vertical" or direction == "both"

+            el.attr "y", -> 

+                dy_orig = dy

+                el_height = d3.select(this).node().getBBox().height

+                dy += el_height

+                dy_orig

+        if direction == "horizontal" or direction == "both"

+            el.attr "x", ->

+                dx_orig = dx

+                el_width = d3.select(this).node().getBBox().width

+                dx += el_width

+                dx_orig

+    )

+