Animation D3.js如何使用基本SVG元素向相反方向过渡

目前，这个条的D3转换从左到右开始，我相信这是默认的

我如何从右到左进行转换？ 以下是我的过渡：

---

通过在转换前后设置其

x

属性，可以使条形图从右向左转换

var svg=d3.选择（“foo”）
var bar=svg.append（“g”）
.attr（“转换”、“翻译（20,20）”）
附加条（“rect”）
.attr（“高度”，15）
.attr（“x”，400）
.transition（）.持续时间（700）
.attr（“宽度”，400）
.attr（“x”，0）

rect{
填充：#CCC；
}

var svg = d3.select("#foo")

var bar = svg.append("g")
             .attr("transform", "translate(20,20)")

bar.append("rect")
   .attr("height", 15)
   .transition().duration(700)
   .attr("width", 400)