js function to start animation [Archive] - XML Elves

js function to start animation

motheherder
05-28-2005, 06:30 AM
Hello all

I have a bit of code similar to the following(below), I need to call this from HTML so require a javascript function e.g. startAnim() to start the animation. The examples I have managed to find seem to require a var for each point in the path, this is not practical for some of the path lengths i need to animate. Can anyone suggest a way of doing this?

Thanks for any help or suggestions

regards

mo

<rect id="button" x="150" y="150" height="20" width="30" fill="red"/>

<rect width="20" height="10" rx="3" ry="3" style="fill: blue; fill-opacity:1; stroke: gray; stroke-opacity:0.9;">
<animateMotion path="
M 79.67411 172.6272 C 97.88749 130.3794 126.0202 115.2727 172.8066 118.6865 C 231.0445 122.9358 261.0526 248.4056 329.8381 168.8031 C 364.9224 128.2017 399.1757 114.9469 435.097 165.1513 C 440.4396 172.6183 444.0925 177.3856 452.1413 183.0295 "
dur="10s" begin="button.mousedown" repeatCount="indefinite" rotate="auto"/>
</rect>

Anonymous
05-28-2005, 10:53 AM
You need only id for your animation tag and put begin="indefinite"

<animateMotion id="MyAnim" path="
M 79.67411 172.6272 C 97.88749 130.3794 126.0202 115.2727 172.8066 118.6865 C 231.0445 122.9358 261.0526 248.4056 329.8381 168.8031 C 364.9224 128.2017 399.1757 114.9469 435.097 165.1513 C 440.4396 172.6183 444.0925 177.3856 452.1413 183.0295 "
dur="10s" begin="indefinite" repeatCount="indefinite" rotate="auto"/>

Suppose svgdoc is svg document defined somewhere ...

function startAnim()
{
svgdoc.getElementById("MyAnim").beginElement()
}

Michel

motheherder
05-29-2005, 11:18 AM
Thanks Michel

works perfectly!

 
Web mp2kmag.com
mapforums.com

EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum