css - 安卓机微信上的animation和svg的兼容处理

Question

我的目的是让一个元素旋转，以下2种尝试在安卓的微信浏览器中都有不兼容的问题，求解决思路。
尝试1： animation

#query .body .tip .loading{
  width: 70px;
  margin-top:39px;
  margin-bottom: 20px;
  -webkit-animation: rotate 1.0s linear infinite;
  animation: rotate 1.0s linear infinite;
}
@keyframes rotate{
  from{-webkit-transform:rotate(0deg)}
  to{-webkit-transform:rotate(360deg)}
}

现象：

有图片，但是是静态的。

---

尝试2： svg

<svg>
    <image class="loading" xlink:href="/image/loading.png" >
    <animateTransform attributeName="transform" 
                      attributeType="XML"
                      type="rotate" 
                      from="0 35 35" 
                      to=" 360 35 35" 
                      dur="2s"
                      repeatCount="indefinite"/>
    </image>
</svg> 

现象 ，无图片。

以上2种方法在IOS 微信中OK。