javascript - svg novice, want to insert pictures into svg

Question

The code is as above. I want to insert a picture into the svg and animate the picture, but it has no effect. Please explain...

Answer 1

I have never played with svg. After a brief look at the API, there should be two key points: 1. Set the width and height of svg. 2. Just wrap the animate tag with the image tag. Below is the sample code

<svg width="320" height="320" xmlns="http://www.w3.org/2000/svg">
  <g> 
    <image xlink:href="http://f10.baidu.com/it/u=107851725,1461296661&fm=76" x="160" y="160" height="100" width="100" >
    <animate attributeName="x" values="160;40;160;" dur="3s" repeatCount="indefinite"/>
    </image>
  </g>
</svg>