关于SVG动画

` <svg style="background: url('2.jpg') no-repeat;background-size: cover;" width="800" height="447" version="1.1" >

        
    <g>
          
        <image xlink:href="1.jpg" x="30" y="380"  width="49" height="47" />
        <animateMotion  dur="6s" id="an1"  fill="freeze" 
        path="M30 380 L90 380 C 220 -150 650 70 720 120"
        repeatCount="1" begin="click">
        </animateMotion>
        
    </g>
    <text font-family="microsoft yahei" font-size="25" x="50" y="300" opacity="0">哈哈哈
        <animate attributeName="opacity" from="0" to="1" begin="an1.end" fill="freeze" dur="3s" />
    </text>  
  
    
</svg>`

5b26e9f63dc91a39b83434d30a1e322.png
da43de6a80cb3424da851642c87159e.png
我已定好开始的位置,可是点击执行的动画的时候,开始的位置却跑到了下面,是什么情况,哪路大神知道呀!

阅读 1.6k
1 个回答

开始的位置应该是path的起始位置,也就是 “M30 380 L90 380 ”中的[30,380],在左下角,横线的起始位置。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题