结合使用animateMotion和keyTimes / keyPoints

Question

结合使用animateMotion和keyTimes / keyPoints

我正在尝试<animateMotion>通过使用keyTimes="…"and keyPoints="…"属性在SVG上使用非线性动画速率。它似乎不起作用：动画运动是尽可能线性的。

这是测试文件，^{尝试一下！}

<svg xmlns="http://www.w3.org/2000/svg" xmlns:x="http://www.w3.org/1999/xlink"
     viewBox="0 0 300 200">
  <style>
    path   { stroke:#999 }
    circle { fill-opacity:0.5; stroke:black }
  </style>
  <path   id="p" d="M30,160 L270,40" />
  <circle id="c" r="5" />
  <animateMotion x:href="#c" fill="freeze"
    dur="10s"
    keyTimes="0;0.1;1"
    keyPoints="0;0.9;1">
    <mpath x:href="#p" />
  </animateMotion>
</svg>

Run Code Online (Sandbox Code Playgroud)

工作时，球应在第一秒内沿路径移动90％，并在剩余的9秒内将最后10％的路径移动。我需要进行哪些更改才能使其正常工作？

我在网上找到了另一个可以正常运行的示例，因此我知道这不是我的OS /浏览器/版本存在问题。

_{（FWIW：Win7x64，Chrome30）}