The rotate attribute shows the rotation of an animated element as it travels along a specified path in an <animateMotion> element.
Syntax:
rotate = auto | auto-reverse | number
Attribute Values:
The rotate attribute accepts the values mentioned above and described below:
auto: This value allows the animated element's rotation to change dynamically as it travels along the path. In this, the element aligns itself to its right-hand side in the current direction of motion.
auto-reverse: This value allows the animated element's rotation to change dynamically as it travels along the path. In this, the element aligns itself to its left-hand side in the current direction of motion.
number: This value shows a constant rotation, that does not change with the animation.
The Below examples illustrate the use of the rotate attribute.