今突然想要做一個箭頭下移的動畫。於是我打開手機文本編輯器，配合網上搜尋的資料，就做成了以下動畫：
該動畫本質上就是一條線的拉長，以及三角形箭頭的移動。
全部代碼在此：
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg"
width="240.0px"
height="240.0px"
viewBox="0 0 240.0 240.0"
>
<line x1="120" y1="0" x2="120" y2="0" stroke="blue" stroke-width="4" >
<animate attributeName="y2" fill="freeze" id="aarrow1" begin="0;aarrow1.end+3s" dur="3s" values="0;228" />
</line>
<polygon
stroke="none"
fill="blue"
points="114,0 126,0 120,12" >
<animateTransform attributeName="transform" attributeType="XML" type="translate"
from="0 0"
to="0 228"
dur="3s" begin="0;aarrow1.end+3s" fill="freeze" repeatCount="0"/>
</polygon>
</svg>特別要說明的是，不同類型的元素要用不同的方法移動。如果是<circle/>等元素，它是用一組x,y來定位的，那就可以用<animate/>來直線移動。然而對於<polygon/>或<path/>等元素，就只能用<animateTransform/>來移動。
反過來說，<animateTransform/>能移動任何物體，但需要注意的是，它會跟原有的transform屬性疊加或覆蓋。