javascript - 将SVG元素旋转360度不会执行任何操作

我正在使用d3.js。我正在尝试将SVG元素旋转360度，以使其旋转一次并返回其原始位置。

像这样将其旋转3/4即可正常工作：

    thing
        .transition()
        .attr('transform', 'rotate(270,640,426)')
        .duration(6000);

但是尝试为完整的旋转设置动画没有任何效果：

    thing
        .transition()
        .attr('transform', 'rotate(360,640,426)')
        .duration(6000);

我认为d3（或者这可能是有关svg transform属性的更普遍的事实）看到结尾与开头相同，只是不采取任何措施就采用了捷径。同样，如果我做365度，它只会移动+5度。

答：为什么？
B.正确的做法是什么？

最佳答案

D3标准化SVG转换；这就是您所看到的效果的原因。您可以使用自定义补间功能来执行此操作：

function rotTween() {
  var i = d3.interpolate(0, 360);
  return function(t) {
    return "rotate(" + i(t) + ")";
  };
}

完整的示例here。

关于javascript - 将SVG元素旋转360度不会执行任何操作，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/22568803/