javascript - Bend SVG `<g>` around Curve -

i'm using d3.js draw svg <path>s in straight line. of these elements contained in <g> same vertical transformation.

i'd "wrap" these elements around circular arc. @ end, each rectangle should become small segment of arc, , vertical lines point center of circle.

i realize in arc beginning: drawing thick circle segments end-to-end instead of rectangles, example. this, however, sounds lot of math , calculation, new svg.

is there way transform these elements onto curve post hoc, meaning use code have draws these rectangles—maybe changing transform attribute? if there's external svg library (though i've looked no success), i'd consider using that.

easier using path arc command a—though not quite hoping in can't morph elements arranged in line around circle—i found d3.arc() (formerly d3.svg.arc()).

canvas.selectall(".xcontainer")     .selectall("path")     .data(...)     .enter()     .append("path")     .attr("fill", function(element, index) { return colorforsize(element[4]); })     .attr("d", function(element, index) {          var arc = d3.arc()             .innerradius(ir)             .outerradius(ir + 10)             .startangle(element[1])             .endangle(element[2])             .cornerradius(isrounded ? 8 : 0);          return arc();      }); 

thanks, bill.