Javascript 如何转换具有不同持续时间的两个属性？

我知道在D3中，在给定的时刻，一个元素上只能运行一个转换。这是否意味着不可能转换具有不同持续时间的两个不同属性，或者是否有解决此限制的方法

例如，我希望以不同的速度对椭圆的宽度和高度设置动画。 但是，下面的代码仅对这两个属性使用第二个持续时间

selection.
  transition().
  duration(5000).
  ease(d3.easeBounceOut).
  attr('rx', 250). 
  //.transition() calling transition() here would schedule the animation after the first one. 
  duration(1000).
  ease(d3.easeBounceOut).
  attr('ry', 250)

让svg=d3.选择（“svg”），
保证金={
前20名，
右:20,，
底数：20，
左：40
},
宽度=+svg.attr（“宽度”）-margin.left-margin.right，
高度=+svg.attr（“高度”）-margin.top-margin.bottom，
g=svg.append（“g”）.attr（“transform”、“translate”（+margin.left+）、“+margin.top+”）；
g、 附加（'eliple'）.attr（'id'，'9'）.attr（'cx'，250）.attr（'cy'，250）.attr（'rx'，25）.attr（'ry'，25）.attr（'fill'，'black'））
.transition（）.duration（5000）.ease（d3.easeBuncounceout）.attr（'rx'，250）.duration（1000）.ease（d3.easeBuncounceout）.attr（'ry'，250）

通过使用，您可以一次指定多个转换

让svg=d3.选择（“svg”），
保证金={
前20名，
右:20,，
底数：20，
左：40
},
宽度=+svg.attr（“宽度”）-margin.left-margin.right，
高度=+svg.attr（“高度”）-margin.top-margin.bottom，
g=svg.append（“g”）.attr（“transform”、“translate”（+margin.left+）、“+margin.top+”）；
常量椭圆=g.append（'椭圆'）
.attr（'id'，'9'）
.attr（'cx'，250）
.attr（'cy'，250）
.attr（'rx'，25）
.attr（'ry'，25）
.attr（“填充”、“黑色”）；
椭圆
.过渡（“rx”）
.期限（2000年）
.轻松（d3.轻松反弹）
.attr（'rx'，250）；
椭圆
.过渡（“ry”）
.持续时间（1000）
.轻松（d3.轻松反弹）
.attr（'ry'，250）