如何在d3 js版本3中使用cirlce绘制条形图

Question

我想要d3 js中用于绘制条字符的d3 js代码，您可以参考随附的图片以获取更多信息。

使用下面的代码，我可以创建基本的条形图。但是无法绘制如图所示的圆形条形图。

var widthScale=d3.scale.linear()
.domain([0,60])
.range([0,width]);

var colorScale=d3.scale.linear()
.domain([0,60])
.range(["orange","pink"]);

var axis=d3.svg.axis()
.ticks(5)
.scale(widthScale)
//.orient("left");

var canvas=d3.select("body")
.append("svg")
.attr("width",width)
.attr("height",height)
.append("g")
.attr("transform","translate(30,0)")
//.call(axis);


var bars=canvas.selectAll("rect")
.data(dataArray)
.enter()
.append("rect")
.attr("width",function(d){return 50})
.attr("height",function(d){return widthScale(d)})
.attr("x",function(d,i){ return i * 100})
.attr("y",function(d){ return height-widthScale(d)})
.attr("fill",function(d){return colorScale(d)})


canvas.append("g")
.attr("transform","translate(0,460)")
.call(axis);