yil*_*yin 4 html javascript svg
我有以下SVG文件.
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="htntp://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
version="1.1"
width="1000"
height="650"
id="svgContainer">
<g
id="truck">
<animate attributeName="fill" from="black" to="red" dur="5s"/>
<path
d="m 655.589,484.36218 -6.18561,-128.61524 -110.99241,-15.79583 -34.55321,-87.58893 -94.74579,0 3.03024,178.75619 -322.238663,2.0203 0.145305,51.22351 z"
id="body"
fill="#000000"
stroke="#000000"
stroke-width="1px"
stroke-linecap="butt"
stroke-linejoin="miter"
stroke-opacity="1" />
<animate attributeType="XML" attributeName="x" to="1000" begin="indefinite" dur="1s" />
<animate attributeType="XML" attributeName="y" to="1000" begin="indefinite" dur="1s" />
</g>
</svg>
</g>
</svg>
Run Code Online (Sandbox Code Playgroud)
我只想将它移动到动画的其他地方,但它不起作用.这里有什么我想念的吗?(我想g用内部的所有内容为元素设置动画.为了简单起见,我删除了其余的元素.)
yil*_*yin 10
好的,我通过以下方式更改为动画.
<animateTransform
attributeType="XML"
attributeName="transform"
type="translate"
from="0,0" to="1000,1000"
begin="0s" dur="1"
repeatCount="indefinite"/>
Run Code Online (Sandbox Code Playgroud)
它开始起作用了.
UPDATE
我找到了更好的解决方案.在第一个中,在动画之后我的组元素返回到其原始位置.随后它会保持原样.
<animateMotion
from="0,0" to="500,0"
dur="4s" fill="freeze"/>
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
7517 次 |
| 最近记录: |