<div>
  animateMotion.rotate：
  <label><input type="radio" name="rotate" value="0"  onchange="onRotateChange(arguments[0])" />0</label>
  <label><input type="radio" name="rotate" value="45"  onchange="onRotateChange(arguments[0])" />45</label>
  <label><input type="radio" name="rotate" value="90" onchange="onRotateChange(arguments[0])" />90</label>
  <label><input type="radio" name="rotate" value="120" onchange="onRotateChange(arguments[0])" />120</label>
  <label><input type="radio" name="rotate" value="auto"checked onchange="onRotateChange(arguments[0])" />auto</label>
  <label><input type="radio" name="rotate" value="auto-reverse" onchange="onRotateChange(arguments[0])" />auto-reverse</label>
</div>
<br>

<svg>
  <defs>
    <path id="car" d="M29.395,0H17.636c-3.117,0-5.643,3.467-5.643,6.584v34.804c0,3.116,2.526,5.644,5.643,5.644h11.759
    c3.116,0,5.644-2.527,5.644-5.644V6.584C35.037,3.467,32.511,0,29.395,0z M34.05,14.188v11.665l-2.729,0.351v-4.806L34.05,14.188z
     M32.618,10.773c-1.016,3.9-2.219,8.51-2.219,8.51H16.631l-2.222-8.51C14.41,10.773,23.293,7.755,32.618,10.773z M15.741,21.713
    v4.492l-2.73-0.349V14.502L15.741,21.713z M13.011,37.938V27.579l2.73,0.343v8.196L13.011,37.938z M14.568,40.882l2.218-3.336
    h13.771l2.219,3.336H14.568z M31.321,35.805v-7.872l2.729-0.355v10.048L31.321,35.805z" transform="rotate(90,20,-3)" />
  </defs>
  <path id="route" fill="none" stroke="lightgrey" d="M20,50 C20,-50 180,150 180,50 C180-50 20,150 20,50 z" />

  <use href="#car">
    <animateMotion dur="10s" repeatCount="indefinite" rotate="auto">
      <mpath href="#route" />
    </animateMotion>
  </use>
  
  <use href="#car" fill="blue">
    <animateMotion dur="3s" repeatCount="indefinite" rotate="auto">
      <mpath href="#route" />
    </animateMotion>
  </use>

  <circle r="5" fill="red">
    <animateMotion dur="10s" repeatCount="indefinite" rotate="auto">
      <mpath href="#route" />
    </animateMotion>
  </circle>
  
  <circle r="5" fill="green">
    <animateMotion dur="3s" repeatCount="indefinite" rotate="auto">
      <mpath href="#route" />
    </animateMotion>
  </circle>
</svg>

function onRotateChange(e) {
  const animateMotions = document.getElementsByTagName("animateMotion");
  for (let index = 0; index < animateMotions.length; ++index) {
    const animateMotion = animateMotions[index];
    animateMotion.setAttribute("rotate", e.target.value);
  }
}