Javascript 反转d3条形图加载动画

我一直在用d3库用JavaScript创建条形图。我想用以下代码包含一个加载动画：

svg.selectAll("rect")
      .data(sortedPartyArray) 
      .enter()
      .append("rect")
        .style("fill", "steelblue")
        .attr('x', (s) => xScale(s[0]) + 40)
        .attr('y', (s) => yScale(s[1]) + 19.5)
        .attr('width', xScale.bandwidth())
          .attr('height', 0)  //on load animation
          .transition()
          .delay((d, i) => {return i*50})
          .duration(800)
          .attr('height', (s) => height - yScale(s[1]));

本质上，这就是它应该做的；它为图表加载时创建动画。我唯一的问题是动画从上到下加载条，但我希望条从下到上加载。我该怎么做

---

提前感谢。

您需要将转换应用于y和高度

请仔细检查首字母

y

-我想应该是

高度+19.5

svg.selectAll("rect")
      .data(sortedPartyArray) 
      .enter()
      .append("rect")
        .style("fill", "steelblue")
        .attr('x', (s) => xScale(s[0]) + 40)
        .attr('y', height + 19.5)
        .attr('width', xScale.bandwidth())
        .attr('height', 0)
        .transition()
        .delay((d, i) => {return i*50})
        .duration(800)
        .attr('y', (s) => yScale(s[1]) + 19.5)
        .attr('height', (s) => height - yScale(s[1]));