4

不能得到这个SVG动画作为谷歌地图标记谷歌地图SVG标记动画

<svg width="120px" height="120px" viewBox="0 0 120 120" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> 
 
    <g fill="none" fill-rule="evenodd" stroke-width="1" stroke="black" stroke-opacity="0.3"> 
 
    <circle cx="50" cy="50" r="50"> 
 
     <animate attributeName="r" begin="0s" dur="3s" values="0;50" keyTimes="0;1" keySplines="0.1,0.2,0.3,1" calcMode="spline" repeatCount="indefinite"></animate> 
 
     <animate attributeName="stroke-opacity" begin="0s" dur="3s" values="0;.3;.3;0" repeatCount="indefinite"></animate> 
 
    </circle> 
 
    <circle cx="50" cy="50" r="30"> 
 
     <animate attributeName="r" begin="-1s" dur="3s" values="0;50" keyTimes="0;1" keySplines="0.1,0.2,0.3,1" calcMode="spline" repeatCount="indefinite"></animate> 
 
     <animate attributeName="stroke-opacity" begin="-1s" dur="3s" values="0;.3;.3;0" repeatCount="indefinite"></animate> 
 
    </circle> 
 
    </g> 
 
</svg>

+0

你能为此创建一个小提琴吗? –

+4

设置标记的'优化'选项为'false' –

+0

@ Dr.Molle可以添加那个答案,以便我可以接受它吗? –

回答

3

正如在评论中提到,设置标记选项optimized: false

docs

禁用 优化渲染为动画GIF或PNG,或当每个标记 必须呈现为单独的DOM元素(仅高级的使用)。

+0

嘿,我欣赏巨魔 –