此前我已經做了兩個簡易箭頭動畫：
後來在跟朋友談到這件事時，忽然想到還有一種更簡單的方法：
代碼：
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="240.0px" height="240.0px">
<line x1="120" y1="0" x2="120" y2="228" stroke="blue" stroke-width="4"/>
<polygon stroke="none" fill="blue" points="114,228 126,228 120,240" />
<animateTransform attributeName="transform" attributeType="XML" type="translate"
values="0 -240;0 0;0 0;0 240" dur="7s" repeatCount="indefinite"/>
</svg>小的箭頭：
但是Firefox for Android出現問題
firefox上只移動很短的距離。猜測原因是缺viewbox或需要加growp。
加viewbox（不行）：
加了growp（行了）：
小的：
教訓是不要直接對最外層<svg/>進行動畫操作，必要時套上<g/>。